Sunday, December 7, 2014

Select and Select All Rows in RadGrid control + Checkbox

Select and Select All rows in the RadGrid control can be done by using below javascirpt code.
Check and Uncheck Checkboxes in RadGrid
<telerik:GridTemplateColumn UniqueName="Select" HeaderStyle-Width="5%" Visible="false">
<HeaderTemplate>
<asp:CheckBox ID="checkAll" runat="server" onclick="CheckAll(this)" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="cboxSelect" runat="server" />                                                                    </ItemTemplate>

                                                                </telerik:GridTemplateColumn>
   function SelectAll(obj) {

                var grid = document.getElementById("<%= RadGrid.ClientID %>");
                var inputs = grid.getElementsByTagName("input");

                for (var i = 0; i < inputs.length; i++) {
                    if (inputs[i].type == "checkbox") {
                        inputs[i].checked = obj.checked;
                    }
                }
            }

            function CheckAll(id) {
                var masterTable = $find("<%= RadGrid.ClientID %>").get_masterTableView();
                var row = masterTable.get_dataItems();
                if (id.checked == true) {
                    for (var i = 0; i < row.length; i++) {
                        masterTable.get_dataItems()[i].findElement("cboxSelect").checked = true; // for checking the checkboxes
                    }
                }
                else {
                    for (var i = 0; i < row.length; i++) {
                        masterTable.get_dataItems()[i].findElement("cboxSelect").checked = false; // for unchecking the checkboxes
                    }
                }
            }


No comments:

Post a Comment