Category / Section
How to change the column stacking at runtime in StackedHeader of WPF DataGrid?
5 mins read
You can define more than one header for WPF DataGrid (SfDataGrid) using StackedHeaderRows and you can define the columns by setting StackedHeaderRows.StackedColumns. The columns in StackedHeaderRow are stacked or grouped based on the StackedColumn.ChildColumns property.
The following code example has DataGrid defined with StackedHeaderRows.
<Syncfusion:SfDataGrid Name="SfdataGrid"
AutoGenerateColumns="True"
ItemsSource="{Binding Employee}">
<Syncfusion:SfDataGrid.StackedHeaderRows>
<Syncfusion:StackedHeaderRow>
<Syncfusion:StackedHeaderRow.StackedColumns>
<Syncfusion:StackedColumn ChildColumns="EmployeeID,Name"
HeaderText="Employee Details"/>
<Syncfusion:StackedColumn ChildColumns="ContactID,Title"
HeaderText="Contact details"/>
<Syncfusion:StackedColumn ChildColumns="SickLeaveHours,Salary"
HeaderText="Salary Details"/>
</Syncfusion:StackedHeaderRow.StackedColumns>
</Syncfusion:StackedHeaderRow>
</Syncfusion:SfDataGrid.StackedHeaderRows>
</Syncfusion:SfDataGrid>The following screenshot shows DataGrid with StackedHeaderRows.
Figure 1: DataGrid with StackedHeaderRows
You can change the column stacking at runtime by setting the StackedColumns.ChildColumns property as shown in the following code example.
private void AddinStackedHeaderRow_Click(object sender, RoutedEventArgs e)
{
var childcolumn = this.SfdataGrid.StackedHeaderRows[0].StackedColumns[0].ChildColumns;
this.SfdataGrid.StackedHeaderRows[0].StackedColumns[0].ChildColumns = childcolumn + "," + "BirthDate" + "," + "NationalIDNumber";
}The following screenshot shows the output of the SfDataGrid with the newly updated ChildColumns to the already existing StackedColumn in StackedHeaderRows.
Figure 2: ChildColumns added to the existing StackedColumn
Conclusion
I hope you enjoyed learning about how to change the column stacking at runtime in StackedHeader of DataGrid.
You can refer to our WPF DataGrid feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications. You can also explore our WPF DataGrid example to understand how to create and manipulate data.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
