Question

我想用一些条件检查行中的复选框。

第一个条件是在同一行连续选择三个复选框时，它应显示警告弹出窗口。（“您不能连续选择连续三个小时”。）
下一个条件是，每行不应选中三个以上的复选框。

我使用了下面的java脚本，在此代码中以列方式进行检查，但我想以行方式检查。

我怎样才能达到这个条件？

    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

您可以在gridview中获取<tr>（行）的集合并循环遍历它们，查找每行中的复选框。我会将你的变量chkBox重命名为grid，因为你得到的gridView不是一个复选框：

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;
            }
        }
    }
}

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

1 个答案: