Articles in this section
Category / Section

How to load a button in caption summary row and prevent expand and collapse of groups in WPF DataGrid (SfDataGrid)?

1 min read

You can load a button inside the CaptionSummaryCell by customizing the ControlTemplate of the GridCaptionSummaryCell using Style in WPF DataGrid (SfDataGrid).

 

<Style TargetType="syncfusion:GridCaptionSummaryCell">
                <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="syncfusion:GridCaptionSummaryCell">
                        <Border x:Name="PART_GridCaptionSummaryCellBorder"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            SnapsToDevicePixels="True">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="60"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <StackPanel Grid.Column="0">
                                    <Button Content="Click" Width="50" Height="20" Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type syncfusion:SfDataGrid}}, Path=DataContext.ClickCommand}" CommandParameter="{Binding}"/>
                                </StackPanel>
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

 

You can prevent the expanding and collapsing of the group upon clicking the button, by handling the SfDatagrid.GroupCollapsing and SfDatagrid.GroupExpanding events as shown in the below the code.

public MainWindow()
{
    InitializeComponent();
    this.datagrid.GroupCollapsing += Datagrid_GroupCollapsing;
    this.datagrid.GroupExpanding += Datagrid_GroupExpanding;
}
private void Datagrid_GroupExpanding(object sender, Syncfusion.UI.Xaml.Grid.GroupChangingEventArgs e)
{
    //Code to skip expanding the group when clicking the button in caption row. 
    if (Mouse.DirectlyOver is Button) 
    {
        e.Cancel = true;
    }
}
private void Datagrid_GroupCollapsing(object sender, Syncfusion.UI.Xaml.Grid.GroupChangingEventArgs e)
{
    //Code to skip collapsing the group when clicking the button in caption row. 
    if (Mouse.DirectlyOver is Button)
    {
        e.Cancel = true;
    }
}

 

The output upon executing the above task will be as shown below.

Load a button in summaryrow in WPF DataGrid

View sample in GitHub.

 

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