WPF- TabControl with Datagrid in each TabItem

Question

0.00/5 (No votes)

See more:

, +

Hi,

I have been searching around without finding a fix so here I go.

I have a Windows with a center that contain a UserControl that will fill the general area of my application.

I have a TabControl with multiple TabItem. In each TabItem I have to show different controls including Datagrids.

Here is the sample code of my second TabItem.

XML

<TabItem Header="Suivi" IsSelected="True">
           <Grid Background="#FFE5E5E5" >
               <DataGrid x:Name="dgSuivi" ItemsSource="{Binding Source=Suivi}" AutoGenerateColumns="False" CanUserAddRows="False"  >
                   <DataGrid.Columns>
                       <DataGridTextColumn Header="Suivi" Binding="{Binding COD_NOM }" Width="500" />
                       <DataGridTextColumn Header="Date planifiée" Binding="{Binding DAT_PLAN}" Width="150" />
                       <DataGridTextColumn Header="Date révisée" Binding="{Binding DAT_REVIS}" Width="150" />
                       <DataGridTextColumn Header="Date réelle" Binding="{Binding DAT_REEL}" Width="150" />
                   </DataGrid.Columns>
               </DataGrid>
           </Grid>
       </TabItem>

My code behind has a filled property called Suivi.

VB

Public Property Suivi As ObservableCollection(Of MyType)

and MyType is the following class:

VB

Public Class EntiteSgcrSuivi

     Property COD_NOM as String

     Property DAT_PLAN as DateTime

     Property DAT_REVIS as DateTime

     Property DAT_REEL as DateTime

     Property DAT_RAPPEL as DateTime

     Public Sub New()

      COD_NOM_DAT = Nothing
      DAT_PLAN = New System.DateTime(9999, 1, 1)
      DAT_REVIS = New System.DateTime(9999, 1, 1)
      DAT_REEL = New System.DateTime(9999, 1, 1)

     End Sub

    End Class

When I change to the second TabItem (Suivi) the datagrid is filled with empty lines.

[Picture of the datagrid not being filled](http://i.imgur.com/gzyvc0G.png)

I've been searching to fix this but I think I am missing a notion here.
Is my binding done right?

Posted 28-Jul-14 8:44am

CTurcotte

Updated 22-Jul-20 22:25pm

Add a Solution

1 solution

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Faisal Fagihi · Answer 1 · 2020-07-22T22:25:00

I had the same problem and here is my solution:

- Move your DataGrids to the tabcontrol resource as tiggers.

<TabControl>
    <TabControl.Resources>
        <Style x:Key="Tab1" TargetType="TabItem">
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Content">
                        <Setter.Value>
                            <DataGrid Background="#FFF" ItemsSource="{Binding MyListForTab1}" />
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>

        <Style x:Key="Tab2" TargetType="TabItem">
            <Setter Property="Padding" Value="16 6" />
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Content">
                        <Setter.Value>
                            <DataGrid Background="#FFF" ItemsSource="{Binding MyListForTab2}" />
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
    </TabControl.Resources>

    <!--Tab1-->
    <TabItem Style="{StaticResource Tab1}" Header="Tab1" />

    <!--Tab2-->
    <TabItem Style="{StaticResource Tab2}" Header="Tab2" />

</TabControl>

WPF- TabControl with Datagrid in each TabItem

1 solution

Solution 1

Add your solution here

Preview 0

WPF- TabControl with Datagrid in each TabItem

1 solution

Solution 1

Add your solution here

Preview 0

Existing Members

...or Join us