Search code examples
datagridviewdatagridrowsdatagridviewcolumnexpandable

Need data grid control with expandable rows and columns?

I need data grid control that will have expandable rows and columns, tree view, but in both dimensions So i can click + on column group so i can expand it, and on row group. It just has to be like that, any help is welcome.

What I have tried:

All from telerik, syncfusion, Grid Wijmo, Super Data Grid for WinForms.

Just like pivot grid, but for a data. I want to load 500 x 500 grid, and after I collapse some rows and columns, I could find part of the grid at 351st row and 231st column, for an example. Let's say I have 30 column groups, each group has 30 columns. In expanded state, that is 30*30 columns. I could never find the one that I want. So, I should collapse 15 column groups, and like that I should search only 15*30 columns. And that same goes for a rows. I hope you understand me better now.

Solution

  • This is for the Syncfusion GridGroupingControl. It is possible to group rows/columns by using a specific area called GroupDropArea at the top in our GridGroupingControl. You can group data by just dropping the required columns in this area. Make use of the ShowGroupDropArea property so that this area is visible.

    //to show groupdrop area

    this.gridGroupingControl1.ShowGroupDropArea = true;

    But this GroupDropArea can only be used for cells and not for headers. There is no direct support for making the headers expand and collapse like doing it for rows. However we can customize the headers by using the Stacked Headers. Please refer the below code snippet on how to use the stacked headers. All the mentioned columns in this method will be stacked together like in the below image.

    //to initialize an instance of GridStackedHeaderDescriptor

    GridStackedHeaderDescriptor gridStackedHeaderDescriptor13 = new GridStackedHeaderDescriptor();

    //to add group of columns under a single stacked headers

    gridStackedHeaderDescriptor13.VisibleColumns.AddRange(new GridStackedHeaderVisibleColumnDescriptor[] { new GridStackedHeaderVisibleColumnDescriptor("OrderID"), new GridStackedHeaderVisibleColumnDescriptor("CustomerID"), new GridStackedHeaderVisibleColumnDescriptor("EmployeeID")});

    After adding the required columns to stack header, it is possible to show/hide the columns by using the FieldChooser technique. This FieldChooser can be enabled by using the below code. On enabling the Field Chooser you can access it by right clicking the column headers. Please refer the below image.

    //to enable field chooser in gridgroupingcontrol

    FieldChooser fchooser = new FieldChooser(this.gridGroupingControl1);

    //to enable field chooser in gridgroupingcontrol

    FieldChooser fchooser = new FieldChooser(this.gridGroupingControl1);

    Screenshot