Implementing "Select All" Checkbox

[Support]

Hi there,

I am having some trouble implementing a "select all" checkbox for the RadGridView. I have successfully added checkboxes to group headers as shown in the attached screenshot. I need the ability to tick a box (which sits outside the grid) so it will select or deselect all items in the grid. 

Currently when I click on the "select all" checkbox, only four items are selected in the grid out of 131. I believe this has something to do with the control reusing cells. I have implemented the following class.

public class CustomGroupCellHeader : GridGroupContentCellElement
    {
        public event EventHandler CheckChanged;
        public RadCheckBoxElement Checkbox { get; set; }
        public GridViewColumn Column { get; set; }
        public GridRowElement Row { get; set; }
        public Guid OperatorId { get; set; }
        public string OperatorName { get; set; }

        public CustomGroupCellHeader(GridViewColumn column, GridRowElement row) :
            base(column, row)
        {
            this.Column = column;
            this.Row = row;
        }

        protected override void CreateChildElements()
        {
            base.CreateChildElements();
            this.Checkbox = new RadCheckBoxElement();
            this.Checkbox.MinSize = new Size(10, 10);
            this.Checkbox.ToggleStateChanged += new StateChangedEventHandler(_checkbox_ToggleStateChanged);
            this.Children.Insert(0, this.Checkbox);
        }

        protected override System.Drawing.SizeF ArrangeOverride(System.Drawing.SizeF finalSize)
        {
            SizeF size = base.ArrangeOverride(finalSize);
            RectangleF rect = GetClientRectangle(finalSize);
            if (this.Checkbox != null)
            {
                this.Checkbox.Arrange(new RectangleF(rect.X, rect.Y + 5, 10, 10));
            }

            return size;
        }

        private void _checkbox_ToggleStateChanged(object sender, StateChangedEventArgs args)
        {
            if (this.CheckChanged != null)
            {
                this.CheckChanged(this, null);
            }
        }

I have also added the following code into the CreateCell event handler:

private List<CustomGroupCellHeader> _groupCheckboxes = new List<CustomGroupCellHeader>();
private void results_CreateCell(object sender, GridViewCreateCellEventArgs e)
{
    if (e.CellType == typeof(GridGroupContentCellElement))
    {
        CustomGroupCellHeader customCell = new CustomGroupCellHeader(e.Column, e.Row);
        customCell.CheckChanged += new EventHandler(customCell_CheckChanged);
        e.CellElement = customCell;

        _groupCheckboxes.Add(customCell);
    }
}

The variable _groupCheckboxes is intended to store the checkboxes for group headers. How can I ensure that this variable stores ALL checkboxes for group headers?

Thanks

[Svett]

Hello Magnetism,

It seems that the implementation of the custom group cell element is correct. Nevertheless, I cannot determine the implementation the CheckChanged event handler. Could you share a code snippet that shows its actual implementation? Meanwhile, you can select all child rows of a particular group row by using the following code snippet in your custom cell:

private void _checkbox_ToggleStateChanged(object sender, StateChangedEventArgs args)
{
    GridViewGroupRowInfo groupRow = this.RowInfo as GridViewGroupRowInfo;
    bool isSelected = args.ToggleState == Telerik.WinControls.Enumerations.ToggleState.On;
    foreach (GridViewRowInfo row in groupRow.ChildRows)
    {
        row.IsSelected = isSelected;
    }
}

All the best,
Svett
the Telerik team

[Nomesh]

Hi Team,

I am working on Multilevel Gridview in winforms( 4 Levels)

I have Select All Header Checkbox in the GrdiviewCheckBoxColumn in all the four levels.

My requirement is,

When I check/Uncheck the Header Checkbox in one of the levels, I need to change the toggle state of the Header checkboxes automatically in the remaining levels.

For Eg..  If I check the HeaderCheckbox in first level, all the HeaderCheckboxes in the second, third and fourth levels should be checked automatically

If I check the HeaderCheckbox in second level, all the HeaderCheckboxes in the third and fourth levels should be checked automatically.

 

Thanks,

Nomesh

[Dess | Tech Support Engineer, Principal]

Hello ,

Thank you for writing.  

Note that since Q2 2014 SP1, RadGridView supports header checkbox in the GridViewCheckBoxColumn. It is just necessary to set the GridViewCheckBoxColumn.EnableHeaderCheckBox property to true. However, to check/uncheck the inner levels, it is necessary to do it programmatically. You can handle the RadGridView.HeaderCellToggleStateChanged event and iterate all the inner templates and their Rows collection and update the respective boolean cell value.
 
As to the specific custom implementation for the header checkbox, please refer to the attached sample project which result is illustrated in the attached gif file. Note that this is just a sample approach and it may not cover all possible cases. Feel free to modify it in a way which suits your requirement best.
 
I hope this information helps. Should you have further questions I would be glad to help.

 Regards,
Dess
Telerik by Progress

[Ariel]

I need this functionality. But, after compiling the code, it doesn't match the gif. I set EnableHeaderCheckBox to true to see if that would fix it, but it still didn't work.

[Dess | Tech Support Engineer, Principal]

Hello, Ariel,  

If you run the sample project provided in my previous reply with the latest version of the Telerik UI for WinForms suite, it is necessary to make the following change in the CreateCell event handler:

private void radGridView1_CreateCell(object sender, GridViewCreateCellEventArgs e)
{
    if (e.CellType == typeof(GridCheckBoxHeaderCellElement) && e.Column is GridViewCheckBoxColumn)
    {
        e.CellElement = new CheckBoxHeaderCell(e.Column, e.Row);
    }
}

Thus, you will use the custom cell and update the child cells as well when toggling the checkbox in the parent's header.

I hope this information helps. If you need any further assistance please don't hesitate to contact me.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

[Sudha]

Hi Dess

This works fine. But I think there may be an issue. Could you please clarify? When the header checkbox is clicked, it correctly checks the children header and data rows. But when I check a data row of a parent data row, I would expect its children and hierarchy below all get selected. But it doesn't do that. I think when a parent data row is checked all its children header and data rows must be checked as well. See the screenshot attached. Even though Parent1 is selected its children are not. Could you please help me fix this issue?

Thanks

Sudha

[Dess | Tech Support Engineer, Principal]

Hello, Sudha,  

The header checkbox functionality is purposed to affect only the data rows belonging to this template. The header checkbox is located in the column header and thus RadGridView knows which cells exactly to toggle in the data rows. 

However, if you have a hierarchical structure, RadGridView is not aware of the inner columns that store the boolean values for the child templates. That is why this behavior is expected to be handled by the user, not by default. Feel free to use the previously suggested solution with the sample project and gif file.

I hope this information helps.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik