How to handle a DataTemplate inside a tab?

Question

My name is Andrea this is my first post ever.

Frequently you have helped me as a simple reader, now I'm writing because I wanted to direct support.

I have to create and a tab control and with a button "Add Tab" I have to add a new tab with the same content. Up to this everything is fine.

Within Tab I have a textedit and a combobox. My problems are two:

1 How do I load the contents of the combobox for each tab I add? 2 Every time I write the text of and a edit tab override also edit the text of the other tab.

Here the code:

Data Template in Xaml:

  <DataTemplate x:Key="tabItemContent">

            <dxlc:LayoutGroup Orientation="Vertical" Header="Target Description" IsCollapsible="True">
                <!--Name-->
                <dxlc:LayoutItem>
                    <dxlc:LayoutGroup Orientation="Horizontal" ItemSpace="4" >
                        <dxlc:LayoutItem Label="Name" Margin="10">
                            <dxe:TextEdit x:Name="TextEdit_NameTarget"/>
                        </dxlc:LayoutItem>
                    </dxlc:LayoutGroup>
                </dxlc:LayoutItem>
                <!--Nation e Label-->
                <dxlc:LayoutItem>
                    <dxlc:LayoutGroup Orientation="Horizontal" ItemSpace="12" >
                        <dxlc:LayoutItem Label="Nation"  Margin="10">
                            <ComboBox x:Name="ComboBox_TargetNazione" />
                        </dxlc:LayoutItem>                           
                    </dxlc:LayoutGroup>
                </dxlc:LayoutItem>                   
            </dxlc:LayoutGroup>
        </DataTemplate>

C#:

 private void Button_Click_Add(object sender, RoutedEventArgs e)
    {
        DataTemplate tabItemDataTemplate = this.TryFindResource("tabItemContent") as DataTemplate;
        DXTabItem tabItem = new DXTabItem();
        tabItem.Header = "New Tab";
        tabItem.ContentTemplate = tabItemDataTemplate;
        tabControl_Targets.Items.Add(tabItem);

    }

Here's where to load the list into the combobox:

private void LoadComboBoxNation()
    {

        ComboBox_TargetNazione.ItemsSource =
          ManagementTriple.Istance().get_Nation_byTipologyAndContext(ComboBox_TypologyScenario.SelectedItem.ToString(),
          ComboBox_ContextScenario.SelectedItem.ToString());

        controlloselecteditem(ComboBox_SourceNazione.SelectedItem.ToString());

        controlloselecteditem(ComboBox_TargetNazione.SelectedItem.ToString());
    }

Thank you all for the help that you can give me.

Answer 1

DataTemplates require a simple but fundamental requirement to work properly: you should use the ViewModel-First approach.

Ideally, your tab control should have a Binding to some ViewModel. Then, if you want another tab to appear, you should use your button click to call a Command in your ViewModel, then the ViewModel would add another item to your TabControl ItemsSource property (which would be some collection), and the new item would be displayed "automagically" with its respective DataTemplate.

The idea of WPF is to replace all this imperative code in the View (like the one you posted) with a more indirect one, where your only worry is to manipulate things in the ViewModel, and the "Dumb View" just follows.

Hope this helps, but don't hesitate to ask for additional details in the comments.