WPF – Use DataTrigger to set property of component

In Windows Form Programming, if we want to create a data trigger for a component we need to write code to process data change event and give suitable data back. In WPF Microsoft allows us to bind trigger direct to component in XAML code without writing any code. DataTrigger represents a trigger that applies property values or performs actions when the bound data meets a specified condition.

In this example below I would like to demonstrate how we create data trigger in WPF.
I place on grid a combo box and two text box. Then I add 3 combo box item “One”, “Two”, and “Tree”.

<ComboBox Height="26" Margin="34,32,137,0" Name="cbSelection" VerticalAlignment="Top">
	<ComboBoxItem>One</ComboBoxItem>
	<ComboBoxItem>Two</ComboBoxItem>
	<ComboBoxItem>Three</ComboBoxItem>
</ComboBox>
<TextBox  Height="23" Margin="34,0,138,90" Name="txtSelectionOne" VerticalAlignment="Bottom">
</TextBox>
<TextBox  Height="23" Margin="34,0,138,45" Name="txtSelectionTwo" VerticalAlignment="Bottom" >
</TextBox>

Style, ControlTemplate, and DataTemplate all have a triggers collection. A DataTrigger allows you to set property values when the property value of the data object matches a specified Value. Note that you must specify both the Binding and Value properties on a DataTrigger for the data trigger to be meaningful. If one or both of the properties are not specified, an exception is thrown. The Setters property of a DataTrigger object can only consist of Setter objects.
In our example we want when the combo box has value “One”, the text box one will be selected and “Two” for text box two. So we insert the data trigger into Style of each text box.

<TextBox  Height="23" Margin="34,0,138,90" Name="txtSelectionOne" VerticalAlignment="Bottom">
	<TextBox.Style>
		<Style>
			<Setter Property="TextBox.IsEnabled" Value="False"/>
			<Style.Triggers>
				<DataTrigger Binding="{Binding ElementName=cbSelection , Path=Text}" Value="One">
					<Setter  Property="TextBox.IsEnabled" Value="true"/>
				</DataTrigger>
			</Style.Triggers>
		</Style>
	</TextBox.Style>
</TextBox>

The property value produced by this binding is compared with the value specified by the Value property. That value is first converted to the type of the value of the binding (if possible), and then the two values are compared using the Object.Equals method. If the two values are equal, then the associated actions or setters are applied.
For the text box two, you just need to copy same code with small changes and everything will work.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>