Articles in this section
Category / Section

How to load DataTemplate in HeaderCell ?

1 min read

GridDataControl allows you to load DataTemplate in the HeaderCell. You can load the DataTemplate in HeaderCell of GridDataControl by using HeaderCellTemplate property present in the GridDataControl’s VisibleColumns. You can load any control(s) within the DataTemplate.

The following code sample demonstrates how CheckBox is loaded inside HeaderCellsControl using DataTemplate.


<syncfusion:GridDataCheckBoxVisibleColumn MappingName="status">
            <CheckBox Name="checkbox"
                                      Foreground=" Black"
                                      IsChecked="{Binding CellBoundValue, Mode=TwoWay}"
                    <local:CheckBoxClickBehavior />


GridDataControl allows you to control the behavior of the checkBox column. Here the behavior of what should be done when clicking on the checkBox in the header cell is written using the click event of the checkBox in the CheckBoxClickBehavior class. The following code example illustrates how the checkBox column is designed to behave when clicked.


// CheckBoxClickBehavior
void AssociatedObject_Click(object sender, System.Windows.RoutedEventArgs e)
    var checkBox = e.Source as CheckBox;
    var gridDataControl = this.AssociatedObject.FindParentElementOfType<GridDataControl>();
    if (gridDataControl != null)
        bool? state = checkBox.IsChecked;
        if (state == null)
            state = false;
            this.AssociatedObject.IsChecked = false;
        if ((bool)state)
            //Checks all rows in the IsChecked column when the check box in the header cell is checked
            for (int i = 0; i < gridDataControl.Model.View.Records.Count; i++)
                    ((Employee)gridDataControl.Model.View.Records[i].Data).status = true;
        if (((bool)state) == false)
            //UnChecks all rows in the IsChecked column when the check box in the header cell is Unchecked
            for (int i = 0; i < gridDataControl.Model.View.Records.Count; i++)
                    ((Employee)gridDataControl.Model.View.Records[i].Data).status = false;


In this example when the checkBox loaded inside the header cell is checked, then all the rows in that column will be automatically checked and vice versa. Whereas when you uncheck some of the rows in the IsChecked column by editing them, the checkBox in the header cell will go to intermediate state. This is achieved by handling the CurrentCellChanged event in GridDataControl. The following code sample shows how the state of the checkBox in the header cell is changed by handling the CurrentCellChanged event.


void AssociatedObject_CurrentCellChanged(object sender, Syncfusion.Windows.ComponentModel.SyncfusionRoutedEventArgs args)
    int Checkedcount = 0;
    int UnCheckedcount = 0;
    var currentcell = this.AssociatedObject.Model.CurrencyManager.CurrentCell;
    if (currentcell != null)
        if (currentcell.RowIndex == 0 && currentcell.ColumnIndex == 0)
        foreach (var record in this.AssociatedObject.Model.View.Records)
            var row = record.Data as Employee;
            if (row.status == true)
    if (Checkedcount >= 1 && UnCheckedcount >= 1)
        //Setting intermediate state when some rows are checked and some are not
        this.AssociatedObject.Model[0, 0].CellValue = null;
    else if (Checkedcount >= 1 && UnCheckedcount == 0)
        //Setting checked state when all the rows are checked
        this.AssociatedObject.Model[0, 0].CellValue = true;
    else if (Checkedcount == 0 && UnCheckedcount >= 1)
        //Setting unchecked state when all the rows are unchecked
        this.AssociatedObject.Model[0, 0].CellValue = false;
    this.AssociatedObject.Model.Grid.InvalidateCell(GridRangeInfo.Cell(0, 0));


The following screenshot shows the output for the above code in GridDataControl.

D:\Syncfusion\Issues\2014 Volume 2\KB Issues\KB Images\CheckBoxDataTemplateInHeaderCell.png

Did you find this information helpful?
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied