Skip to main content Skip to footer

Toggle RowDetails by Double-Clicking the Grid Row in C1DataGrid

Background:

C1DataGrid has built-in functionality that allows users to toggle RowDetails visibility by clicking a toggle button present in the row header. This is accomplished through the CanUserToggleDetails property. However, in some cases, the developer may want to enable their users to toggle RowDetails visibility by double-clicking the row itself.

This article shows how to implement the toggling of RowDetails by double-clicking the grid row in C1DataGrid.

Steps to Complete:

To toggle RowDetails upon mouse double-click, you must handle C1DataGrid’s MouseDoubleClick event. Once inside the event, access the clicked row (current row) and check the visibility of its RowDetails using the DetailsVisibility property.

Additionally, check whether the element under the mouse cursor is a cell or not. This is necessary in scenarios where the RowDetail control is itself an edit control like C1DataGrid, where the user can double-click a cell. If you do not check the element type below the mouse cursor, double-clicking the RowDetail control will toggle RowDetails visibility instead of editing the value in the RowDetail control. The code below shows how to accomplish this:

private void _grid_MouseDoubleClick(object sender, MouseButtonEventArgs e)
{
        if (_grid.GetCellFromPoint(e.GetPosition(null))!=null)
        {
               C1.WPF.DataGrid.DataGridRow row = _grid.CurrentRow;
               if (row.DetailsVisibility == Visibility.Collapsed)
                    row.DetailsVisibility = Visibility.Visible;
               else
                    row.DetailsVisibility = Visibility.Collapsed;
        }
}

Ruchir Agarwal