如何使用javascript函数从gridview逐行启用/禁用复选框？

Question

I want to check the checkbox in rowwise with the some conditions.

• The first condition is when three Checkboxes are selected continuously in same row,it should display the alert popup.("You can't select continuous three hours").

• Next condition is,it shouldn't select more than three checkbox in each row.

I used the below java script,in this code its checking in column wise but I want to check in row wise.

How can I accomplish this condition ?

    function CheckCheck() {
        var chkBox = document.getElementById('<%=Gv1.ClientID %>');
        var chkBoxCount = chkBox.getElementsByTagName("input");

        var btn = document.getElementById('<%=btnsubmit.ClientID %>');
        var i = 0;
        var tot = 0;
        for (i = 0; i < chkBoxCount.length; i++) {
            if (chkBoxCount[i].checked) {
                tot = tot + 1;

                if (tot > 2) {
                    alert('Cannot check more than 2 check boxes');
                    chkBoxCount[i].checked = false;
                    return;
                }
            }
        }
    }

HTML:

   <asp:GridView ID="Gv1" runat="server" AutoGenerateColumns="False" OnRowDataBound="Gv1_RowDataBound">
        <Columns>
            <asp:BoundField DataField="datedif" HeaderText="Day/Hour" SortExpression="datedif" />
            <asp:TemplateField HeaderText="Hour1">
                <EditItemTemplate>
                    <asp:CheckBox ID="CheckBox1" runat="server" />
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CheckBox1" runat="server" Enabled='<%# Eval("hour1").ToString().Equals("False") %>' />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Hour2">
                <EditItemTemplate>
                    <asp:CheckBox ID="CheckBox2" runat="server" />
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CheckBox2" runat="server" Enabled='<%# Eval("hour2").ToString().Equals("False") %>' />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Hour3">
                <EditItemTemplate>
                    <asp:CheckBox ID="CheckBox3" runat="server" />
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CheckBox3" runat="server" Enabled='<%# Eval("hour3").ToString().Equals("False") %>' />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Hour4">
                <EditItemTemplate>
                    <asp:CheckBox ID="CheckBox4" runat="server" />
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CheckBox4" runat="server" Enabled='<%# Eval("hour4").ToString().Equals("False") %>' />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Hour5">
                <EditItemTemplate>
                    <asp:CheckBox ID="CheckBox5" runat="server" />
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CheckBox5" runat="server" Enabled='<%# Eval("hour5").ToString().Equals("False") %>' />
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>

Answer 1

You can get the collection of <tr> (rows) in the gridview and loop through them, looking for check boxes in each row. I would rename your variable chkBox to something like grid, because you are getting the gridView not a checkbox:

var grid = document.getElementById('<%=Gv1.ClientID %>');
var gridRows = grid.getElementsByTagName("tr");
for (rowIndex = 0; rowIndex < gridRows.length; rowIndex++) {
    var row = gridRows(rowIndex);
    var chkBoxCount = row.getElementsByTagName("input");

    for (i = 0; i < chkBoxCount.length; i++) {
        if (chkBoxCount[i].checked) {
            tot = tot + 1;

            if (tot > 2) {
                alert('Cannot check more than 2 check boxes');
                chkBoxCount[i].checked = false;
                return;
            }
        }
    }
}