This is a migrated thread and some comments may be shown as answers.

Javascript - get number of checkboxes that are checked in the radgrid

4 Answers 621 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Dave Hollen
Top achievements
Rank 1
Dave Hollen asked on 15 Jan 2010, 09:36 PM
Hello,

I am trying to write some Javascript that will traverse all the rows of a radgrid and determine how many rows have a checkbox that is checked. 

I have a GridTemplateColumn that contains a Checkbox in the radgrid.  This is the checkbox I am trying to determine (for each record) if it is checked or not.

How do I do this in Javascript?

I was able to do it on Server side, but I would prefer to do this in Java script.

Thanks!

4 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 18 Jan 2010, 10:13 AM
Hello Dave,

You can use the following client side code in order to get the number of checkboxes checked those are placed in template column of grid.

aspx mark-up:
<telerik:GridTemplateColumn UniqueName="Features" HeaderText="Checkbox"
    <ItemTemplate> 
        <div id="resultList"
            <asp:CheckBox ID="CheckBox 1" runat="server" /> 
    </ItemTemplate> 
</telerik:GridTemplateColumn> 

client side code:
    function getNumber() { 
        var grid = $find("<%=RadGrid1.ClientID %>"); 
        var masterTable = grid.get_masterTableView(); 
        var number = 0; 
        for (var i = 0; i < masterTable.get_dataItems().length; i++) { 
            var gridItemElement = masterTable.get_dataItems()[i].findElement("checkTag"); 
            if (gridItemElement.checked) { 
                number++; 
            } 
        } 
        alert(number); // shows number of checkboxes that are checked 
    } 

Regards,
Shinu.
0
Waseem
Top achievements
Rank 1
answered on 08 Oct 2012, 03:21 PM
This does not work when sometime div in RadGrid is visible or some time div is RadGrid invisble. So this javascript does not work.

                                       <ItemTemplate>
                                            <div id="CheckDiv1" visible='<%# CanChangeData( Eval("CreatorID").ToString() ) %>' >
                                                <nobr>
                                                    <asp:CheckBox ID="CkboxDel" runat="server" Width="20px" ToolTip="Delete note" />&nbsp;
                                                    <asp:ImageButton ID="btnNoteEdit" ToolTip="Edit note" ImageUrl="~/hris/images/EmailAlertEdit.png" runat="server" /> &nbsp;
                                                    <asp:ImageButton ID="btnDel" ToolTip="Delete note" ImageUrl="~/hris/images/EmailAlertDelete.png"  CommandArgument='<%# DataBinder.Eval(Container.DataItem, "NotesID") %>' CommandName="DelNote"
                                                        OnClientClick='<%# confirmDelete( Eval("NotesID").ToString() ) %>' runat="server" /> &nbsp;
                                                </nobr>
                                            </div>
                                        </ItemTemplate>

   function getNumber() { 
        var grid = $find("<%=RadGrid1.ClientID %>"); 
        var masterTable = grid.get_masterTableView(); 
        var number = 0; 
        for (var i = 0; i < masterTable.get_dataItems().length; i++) { 
            var gridItemElement = masterTable.get_dataItems()[i].findElement("checkTag"); 
            if (gridItemElement.checked) { 
                number++; 
            } 
        } 
        alert(number); // shows number of checkboxes that are checked 
    } 

0
Waseem
Top achievements
Rank 1
answered on 08 Oct 2012, 03:22 PM
This does not work when sometime div in RadGrid is visible or some time div is RadGrid invisble. So this javascript does not work.

                                       <ItemTemplate>
                                            <div id="CheckDiv1" visible='<%# CanChangeData( Eval("CreatorID").ToString() ) %>' >
                                                <nobr>
                                                    <asp:CheckBox ID="CkboxDel" runat="server" Width="20px" ToolTip="Delete note" />&nbsp;
                                                    <asp:ImageButton ID="btnNoteEdit" ToolTip="Edit note" ImageUrl="~/hris/images/EmailAlertEdit.png" runat="server" /> &nbsp;
                                                    <asp:ImageButton ID="btnDel" ToolTip="Delete note" ImageUrl="~/hris/images/EmailAlertDelete.png"  CommandArgument='<%# DataBinder.Eval(Container.DataItem, "NotesID") %>' CommandName="DelNote"
                                                        OnClientClick='<%# confirmDelete( Eval("NotesID").ToString() ) %>' runat="server" /> &nbsp;
                                                </nobr>
                                            </div>
                                        </ItemTemplate>
0
Waseem
Top achievements
Rank 1
answered on 08 Oct 2012, 04:09 PM
Thanks i got solution. when div in Radgird is invisble .

function CheckAll(id)
{
 var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
                var row = masterTable.get_dataItems();
                if (id.checked == true) {
                    for (var i = 0; i < row.length; i++) {
                        var txtBox = masterTable.get_dataItems()[i].findElement("CheckDiv1");
                        if (txtBox != null) {
                            masterTable.get_dataItems()[i].findElement("CkboxDel").checked = true;
                        }
                    }
                }
}
Tags
Grid
Asked by
Dave Hollen
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Waseem
Top achievements
Rank 1
Share this question
or