Strange behavior with two-way Binding and TabControl

Question

In my application, I have the following TabControl:

<TabControl ItemsSource="{Binding MyItemsSource}"
            ContentTemplate="{StaticResource ResourceKey=MyContentTemplate}"
            IsSynchronizedWithCurrentItem="True" />

Here is the ContentTemplate used:

<DataTemplate x:Key="MyContentTemplate">
    <Canvas>
        <TextBox Text="{Binding Path=MyFirstText, Mode=TwoWay}" />
        <TextBox Text="{Binding Path=MySecondText, Mode=TwoWay}" />
    </Canvas>
</DataTemplate>

And the ItemsSource:

public ObservableCollection<MyData> MyItemsSource { get; set; }

public class MyData
{
    public string MyFirstText { get; set; }
    public string MySecondText { get; set; }
}

Please consider this scenario:

Select the first tab
Enter some text in the first TextBox
Select the second tab
Select the first tab: The text entered in the TextBox of the first tab disappeared (because the binding was not applied)

Another scenario:

Select the first tab
Enter some text in the first TextBox
Select the second TextBox (or whatever to change the focus except changing tab)
Select the second tab
Select the first tab: The text entered is still displayed (because the binding was applied)

Is that a normal behavior? Or am I doing something wrong? Thank you.

Did you trace? Is Set called? Show MyItemsSource. – paparazzo Aug 12 '13 at 12:30 — paparazzo, Aug 12 '13 at 12:30
I edited to add the ItemsSource. – Morgan M. Aug 12 '13 at 12:41 — Morgan M., Aug 12 '13 at 12:41

score 2 · Accepted Answer · answered Aug 12 '13 at 12:38

It happens because TextBox's update trigger is set to LostFocus by default. Change it to PropertyChanged, and it should work:

<TextBox Text="{Binding Path=MyFirstText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />

UpdateSourceTrigger: http://msdn.microsoft.com/en-us/library/system.windows.data.updatesourcetrigger.aspx

score 1 · Answer 2 · answered Aug 12 '13 at 12:38

It may be related to a focused element and OnLostFocus event being not fired when switching between tabs. Try altering your bindings with UpdateSourceTriger attribute like this:

<DataTemplate x:Key="MyContentTemplate">
    <Canvas>
        <TextBox Text="{Binding Path=MyFirstText, UpdateSourceTrigger=PropertyChanged}" />
        <TextBox Text="{Binding Path=MySecondText, UpdateSourceTrigger=PropertyChanged}" />
    </Canvas>
</DataTemplate>

Also, you do not need to specify twoway mode as in wpf it is the default one.

score 0 · Answer 3 · edited May 23 '17 at 10:26

The issue is that LostFocus isn't fired when changing tabs, you can change the UpdateSourceTrigger to PropertyChanged as previously mentioned, but I preferred extending TabControl and firing LostFocus manually. This way I don't have to add UpdateSourceTrigger=PropertyChanged to every TextBox in my Tab. I also avoid updating the viewmodel with every key press.

This is a derivative of the solution mentioned here. WPF: Data bound TabControl doesn't commit changes when new tab is selected

public class SmartTabControl : TabControl
{
    protected override void OnSelectionChanged(SelectionChangedEventArgs e)
    {
        if (Keyboard.FocusedElement is TextBox)
            Keyboard.FocusedElement.RaiseEvent(new RoutedEventArgs(LostFocusEvent));

        base.OnSelectionChanged(e);
    }
}

Strange behavior with two-way Binding and TabControl

3 Answers3