Overview of UpdateSourceTrigger and Its Properties in WPF

UpdateSourceTrigger

This is a property on a binding that controls the data flow from a target to a source and used for two-way databinding. The default mode is when the focus changes but there are many other options available, that we will see in this article.

Data trigger scenarios

Let's talk about some of the data trigger scenarios. By default, modified values in the binding controls only get pushed down when we do activity related to focus change, like tab out, minimizing and maximizing window, and so on.

In some scenarios we want to update values as quickly as possible, or let's say with every keystoke. So, to do that Microsoft provided UpdateSourceTrigger.

Properties available with UpdateSourceTrigger
  • Default: This is the default value and it means a lost focus for most of the controls
  • LostFocus: Value update will be on hold until the focus moves out of the control
  • PropertyChanged: Value update will happen whenever a target property changes. It usually happen on every keystoke
  • Explicit: Used to defer source updates until the user does it forcibly by the click of a button or so.

Default vs LostFocus

Default and LostFocus means the same thing for most of the controls with the exception of DataGrid. For DataGrid:

  • Lost Focus: Cell lost focus
  • Default: Row lost focus

Code Walkthrough
 
Now let's have a look at the example and sample code:

<Window x:Class="UpdateSourcePropertyDemo.MainWindow"

 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="MainWindow" Height="150" Width="525">

     <Grid>

    <Grid.ColumnDefinitions>

      <ColumnDefinition Width="50*"/>

      <ColumnDefinition Width="50*"/>

    </Grid.ColumnDefinitions>

    <TextBlock Text="Source:" Width="auto"/>

    <TextBox Name="SourceText" Width="160" Height="30" Margin="48,0,44,82" />

    <TextBlock Text="Target:" Grid.Column="1" Width="auto"/>

    <TextBox Name="TargetText" Width="160" Height="30"

             Grid.Column="1" Margin="44,0,47,82" />       

  </Grid>

</Window> 

In the code above I am creating 2 TextBlocks and 2 TextBoxes, that will be shown as:

UpdateSourcePropertyDemo
 
Please note, as of now I haven't done any binding on my textboxes. As a next step, let's pick properties of UpdateSourceTrigger and see what each one does.

Default: When the user changes a value in the source TextBox, the value will be automatically updated in the target TextBox. But when the user modifies the value in the target TextBox, it won't be reflected in the source TextBox, until loss of focus happens.

Code

<grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="50*"/>

<ColumnDefinition Width="50*"/>

</Grid.ColumnDefinitions>

<TextBlock Text="Source:" Width="auto"/>

<TextBox Name="SourceText" Width="160" Height="30" Margin="48,0,44,82" />

<TextBlock Text="Target:" Grid.Column="1" Width="auto"/>

<TextBox Name="TargetText" Width="160" Height="30"

               Text="{Binding ElementName=SourceText, Path=Text,UpdateSourceTrigger=Default}"

               Grid.Column="1" Margin="44,0,47,82" />

</grid>

Output

When the user types into the source TextBox :

Default Property
 
When user types in Target TextBox :

user types in Target
 
LostFocus: As I mentioned earlier, except for a DataGrid, LostFocus behaves the same for all the controls as the Default property.

Code

<grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="50*"/>

<ColumnDefinition Width="50*"/>

</Grid.ColumnDefinitions>

<TextBlock Text="Source:" Width="auto"/>

<TextBox Name="SourceText" Width="160" Height="30" Margin="48,0,44,82" />

<TextBlock Text="Target:" Grid.Column="1" Width="auto"/>

<TextBox Name="TargetText" Width="160" Height="30"

         Text="{Binding ElementName=SourceText, Path=Text,UpdateSourceTrigger=LostFocus}"

         Grid.Column="1" Margin="44,0,47,82" />

</grid>

Output

Here the output will be the same as in the above case (Default) as it is for a TextBox.

PropertyChanged: If the UpdateSourceTrigger property is set to PropertyChanged, then everytime both the source and target will be synchronized. In other words, updating the source TextBox will update the target TextBox on every keystroke and that proves true if the value is updated in the target TextBox.

Code

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="50*"/>

<ColumnDefinition Width="50*"/>

</Grid.ColumnDefinitions>

<TextBlock Text="Source:" Width="auto"/>

<TextBox Name="SourceText" Width="160" Height="30" Margin="48,0,44,82" />

<TextBlock Text="Target:" Grid.Column="1" Width="auto"/>

<TextBox Name="TargetText" Width="160" Height="30"

         Text="{Binding ElementName=SourceText, Path=Text,UpdateSourceTrigger=PropertyChanged}"

         Grid.Column="1" Margin="44,0,47,82" />

</Grid>

Output

When the user types into the source TextBox:

PropertyChanged
 
When the user types into the Target TextBox:
 
user types in Target TextBox
 
After reading this article, I hope you have a clear understanding of UpdateSourceProperty.

Recommended Ebook

Chapter I: Introduction to WPF

Download Now!
Similar Articles