Questions about GridClientSelectColumn in Radgrid

[Joan]

I have hierachy table, which has a detail table. In the detail table, I am using GridClientSelectColumn and allows multi-selection. I want to disable the header checkbox when the checkbox of all items are disabled. How do I know all the check box items are disabled before I disable the header check box?   

[Eyup]

Hello Joan,

You could traverse the detail table's items and check whether their CheckBoxes are disabled:

protected void RadGrid1_PreRender(object sender, EventArgs e)
 {
     GridItem[] nestedViewItems = RadGrid1.MasterTableView.GetItems(GridItemType.NestedView);
     foreach (GridNestedViewItem nestedViewItem in nestedViewItems)
     {
         foreach (GridTableView nestedView in nestedViewItem.NestedTableViews)
         {
             if (nestedView.Items.Count != 0)
             {
                 bool shouldDisableHeaderCheckBox = AreAllCheckBoxesDisabled(nestedView);
                 if (shouldDisableHeaderCheckBox)
                 {
                     GridHeaderItem headerItem = nestedView.GetItems(GridItemType.Header)[0] as GridHeaderItem;
                     (headerItem["MyClientSelectColumn"].Controls[0] as CheckBox).Enabled = false;
                 }
             }
         }
     }
 }
 protected bool AreAllCheckBoxesDisabled(GridTableView tableView)
 {
     foreach (GridDataItem dataItem in tableView.Items)
     {
         if ((dataItem["MyClientSelectColumn"].Controls[0] as CheckBox).Enabled)
         {
             return false;
         }
     }
     return true;
 }

That should do the trick.

Regards,
Eyup
the Telerik team

[Joan]

thank you, Eyup.  That works.

I have a follow up question regarding this.  In the detail table,  I have a header checkbox and I have some items are disabled and some items are enabled in the grid.  When all the enabled items are selected, I need the checkbox on the header to be checked and when all the disabled items are deselected, the checkbox on the header to be deselected.  Could you advise how to do it on the client-side?  Below is my code.

Thanks!

Joan

Below is my code.

function ReminderRowSelected(sender, args) {

            // If all items are selected check the header checkbox
           var nestedView = args.get_tableView();
           if (nestedView != null) {
               if (nestedView.get_dataItems() != null && args.get_tableView().get_dataItems().length > 0) {
                   var disabled = 0;
                   for (i = 0; i < nestedView.get_dataItems().length; i++)
                   {

                       var x = nestedView.get_dataItems()[i].get_element().getElementsByTagName("INPUT")[0];
                       if (x.disabled == true) {
                           disabled++;
                       }
                   }
                }

               if ((args.get_tableView().get_dataItems().length - disabled) == args.get_tableView().get_selectedItems().length) {
                       //check box header item
                      //NEED YOUR HELP HERE
                 }
               }
           }

[Eyup]

Hello Joan,

You could try the following approach:

function rowSelected(sender, args) {
     var tableView = args.get_tableView();
     if (tableView.get_name() == "MyDetailGrid") {
         var areAllEnabledChecked = true;
         for (var i = 0; i < tableView.get_dataItems().length; i++) {
             var currentCheckBox = tableView.get_dataItems()[i].findElement("MyClientSelectColumnSelectCheckBox");
             if (currentCheckBox.disabled == false && currentCheckBox.checked == false) {
                 areAllEnabledChecked = false;
                 break;
             }
         }
         if (areAllEnabledChecked) {
             tableView.get_element().getElementsByTagName("th")[0].firstElementChild.checked = true;
         }
     }
 }

Analogically, you could also do that for deselecting.

Please note that if you use the client-side approach, you will need to handle the perseverance of the header checkbox state since it will reset on every postback because it does not get saved in the ViewState.

I hope this will prove helpful.

All the best,
Eyup
the Telerik team