DataGrid nested in TabItem does not render when ItemSource only contains a single item

[Brandon Hankins]

Hello,

I have a WPF page when the standard WPF TabItem that contains SfDataGrid. The item source is bound to an ObservableCollection. When I select the tab that contains the SfDataGrid, it does not render on the screen unless there is at least 2 items in the item source collection. Below is the XAML for the TabItem containing the grid view.

<TabItem x:Name="WeldsTab"

                                 IsSelected="True">

                            <TabItem.Header>

                                <TextBlock Text="Welds" />

                            </TabItem.Header>

                            <StackPanel Margin="20,20,15,0">

                                <sfGrid:SfDataGrid x:Name="WeldsGrid"

                                                   ItemsSource="{Binding CurrentIsometric.Welds}"

                                                   SelectedItem="{Binding SelectedWeld, Mode=TwoWay}"

                                                   LiveDataUpdateMode="AllowDataShaping"

                                                   AddNewRowPosition="None"

                                                   HeaderRowHeight="60"

                                                   RowValidating="WeldsGrid_RowValidating"

                                                   CurrentCellValidating="WeldsGrid_CurrentCellValidating"

                                                   GridCopyOption="CopyData,IncludeFormat"

                                                   AllowEditing="True"

                                                   AllowDeleting="True"

                                                   AllowFiltering="True"

                                                   AllowResizingColumns="True"

                                                   AutoGenerateColumns="False"

                                                   Height="670"

                                                   SelectionMode="Extended"

                                                   SelectionUnit="Cell"

                                                   ScrollViewer.VerticalScrollBarVisibility="Auto"

                                                   ScrollViewer.HorizontalScrollBarVisibility="Auto"

                                                   Margin="0">

                                    <sfGrid:SfDataGrid.Columns>

                                        <sfGrid:GridCheckBoxColumn MappingName="DeleteWeld"

                                                                   HeaderText="Delete"

                                                                   Width="75"

                                                                   AllowFiltering="False"/>

                                        <sfGrid:GridCheckBoxColumn MappingName="VoidWeld"

                                                                   HeaderText="Void"

                                                                   Width="75"

                                                                   AllowFiltering="False"/>

                                        <sfGrid:GridTextColumn MappingName="ShopWeldFieldWeld" 

                                                      HeaderText="FieldWeld/ShopWeld"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="WeldClass" 

                                                            HeaderText="Weld Class"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="WeldNumber" 

                                                      HeaderText="Weld No."

                                                               AllowEditing="False"

                                                               Width="75"/>

                                        <sfGrid:GridTextColumn MappingName="SpecificationNumber" 

                                                          HeaderText="Spec No."

                                                               Width="75"/>

                                        <sfGrid:GridTextColumn MappingName="WeldType" 

                                                      HeaderText="Weld Type"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="Grade" 

                                                      HeaderText="Grade"

                                                               Width="75"/>

                                        <sfGrid:GridTextColumn MappingName="PNumber" 

                                                      HeaderText="P#"

                                                               Width="75"/>

                                        <sfGrid:GridNumericColumn MappingName="PipeDiameter" 

                                                     HeaderText="Dia. Inches"

                                                              NumberDecimalDigits="2"

                                                              Width="75"/>

                                        <sfGrid:GridTextColumn MappingName="Schedule" 

                                                      HeaderText="Schedule"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="Welder"

                                                               HeaderText="Welder"

                                                               Width="80"/>

                                        <!--<sfGrid:GridTemplateColumn>

                                            <sfGrid:GridTemplateColumn.CellTemplate>

                                                <DataTemplate>

                                                    <TextBlock Text="{Binding Welder.RNumber}" />

                                                </DataTemplate>

                                            </sfGrid:GridTemplateColumn.CellTemplate>

                                            <sfGrid:GridTemplateColumn.EditTemplate>

                                                <DataTemplate>

                                                    <sfInput:SfTextBoxExt Style="{DynamicResource DefaultTextBox}"

                                                                          Width="230"

                                                                          DataContext="{Binding ViewIsoViewModel, RelativeSource={RelativeSource Self }}"

                                                                          AutoCompleteMode="Suggest"

                                                                          AutoCompleteSource="{Binding Welders.Name}"

                                                                          SearchItemPath="Name"

                                                                          SelectedItem="{Binding Welder, Mode=TwoWay}" />

                                                </DataTemplate>

                                            </sfGrid:GridTemplateColumn.EditTemplate>

                                        </sfGrid:GridTemplateColumn>-->

                                        <sfGrid:GridTextColumn MappingName="WeldDate"

                                                               HeaderText="Weld Date"

                                                               DisplayBinding="{Binding WeldDate, Converter={StaticResource shortDateConverter}}"

                                                               Width="75"/>

                                        <sfGrid:GridTextColumn MappingName="WpsNumber" 

                                                      HeaderText="WPS"

                                                               Width="75"/>

                                        <sfGrid:GridTextColumn MappingName="PWHTCycle"

                                                               HeaderText="PWHT Cycle Temp/Time"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="VisualCheck"

                                                               HeaderText="Visual Check"

                                                               Width="75"/>

                                        <sfGrid:GridTextColumn MappingName="InspectorId"

                                                               HeaderText="Inspector Id"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="InspectionDate"

                                                               HeaderText="Inspection Date"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="RadioGraphicTest"

                                                               HeaderText="Radiographic Test"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="PtmtStatus"

                                                               HeaderText="MT/PT Test"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="HardnessTest"

                                                               HeaderText="Hardness Test"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="FitUpStatus"

                                                               HeaderText="Fit Up Status"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="PreHeatTemp"

                                                               HeaderText="Pre-Heat/Interpass Temp"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="MaterialType"

                                                               HeaderText="Material (SA)"

                                                               Width="100"/>

                                        <sfGrid:GridTextColumn MappingName="PWHTStatus"

                                                               HeaderText="PWHT Status"

                                                               Width="100"/>

                                    </sfGrid:SfDataGrid.Columns>

                                    <sfGrid:SfDataGrid.SortComparers>

                                        <Linq:SortComparer Comparer="{StaticResource WeldNumberSorter}" PropertyName="WeldNumber"/>

                                    </sfGrid:SfDataGrid.SortComparers>

                                </sfGrid:SfDataGrid>

                                <TextBlock Text="{Binding UpdateSpoolsAndWeldsMessage}"

                                           HorizontalAlignment="Right"

                                           Margin="0,20,0,0"

                                           Foreground="{Binding UpdateSpoolsAndWeldsMessageColor}"/>

                                <StackPanel Orientation="Horizontal" Margin="1272,0,0,0">

                                    <Button Command="{Binding AddWelds}" 

                                        HorizontalAlignment="Right"

                                        VerticalAlignment="Top"

                                        Margin="0,0,20,0"

                                        Style="{DynamicResource DefaultActionButton}"

                                        Content="Add Welds"

                                        Grid.Row="3"/>

                                    <Button Command="{Binding UpdateWeldsAndSpools}"

                                            HorizontalAlignment="Right"

                                            VerticalAlignment="Top"

                                            Margin="0"

                                            Style="{DynamicResource DefaultActionButton}"

                                            Content="Save Changes"

                                            Grid.Row="3"/>

                                </StackPanel>

                            </StackPanel>

                        </TabItem>

[Srinivasan Vasu]

Hi Brandon, 

 

Thank you for contacting Syncfusion support. 

 

We have analyzed your query. We are not able to reproduce the reported “SfDataGrid nested in TabItem does not render when ItemSource only contains a single item” issue. For your reference we have attached the tested sample in the below sample location, please revert by modifying the attached sample based on your application along with the replication procedure. It will be helpful for us to analyze further.  

Sample Location: SfDataGridFiltering 

 

Regards, 

Srinivasan 

[Brandon Hankins]

I will not be able to modify the example to reproduce since it requires an external data source contained within our network. I can attempt to explain the scenario below.

Here is the flow of the application to get to the point where the SfDataGrid fails to render properly:

1. User selects a Project and is taken to a project page that has a list of Isometric drawings

2. User selects which drawing they would like to view data for and clicks Open

3. User is taken to the Isometric details page which contains two tabs each with a SfDataGrid. To get the data we pass the Isometric ID to the Page contstructor, use that ID to query the database asynchronously for the proper Isometric data. We then pass that Isometric data into the ViewModel constructor. The Page DataContext is set to the new ViewModel in the Page.cs.

For whatever reason, when there is only 1 item in the non-visible tab it does not render. If I take both grids out of the Tab control and stack them on the page vertically, they both render properly. If I use the same data and bind to the standard C# DataGrid control, it renders inside the tab fine.

[Brandon Hankins]

I have resolved the issue. I was overriding the template in App.xaml in order to globally set border colors and something was inadvertently changed when I copied the default template in Blend.

Sorry for the inconvenience.

Thanks! 

[Srinivasan Vasu]

Hi Brandon,

Thanks for your update.
 

Regards, 

Srinivasan