0

编辑： 什么不起作用：-我有两列（全部批准/全部拒绝）我如何限制用户只允许一个复选框？如果您不使用gridview，则以下代码有效....

我在这里问过这个问题（只允许选中一个（批准/拒绝）复选框）并且只有当我有 asp.net 控件含义而不使用 gridview 控件时它才能按预期工作，现在我处于我有的情况使用 gridview 控件，似乎我的代码不起作用......我保持了相同的类名。有什么帮助吗？

这是我的带有gridview的.aspx代码：

<script type="text/javascript" language="javascript">

         $(document).ready(function () {
             $('#C1All').click(function () { debugger
                 $('.col1 > input').attr("checked", $('#C1All').attr("checked"));
                 $('.col2 > input').removeAttr("checked");
                 $('#C2All').removeAttr("checked");
             });

             $('#C2All').click(function () { debugger
                 $('.col2 > input').attr("checked", $('#C2All').attr("checked"));
                 $('.col1 > input').removeAttr("checked");
                 $('#C1All').removeAttr("checked");
             });

             $('.col1').each(function () { 
                 $(this).click(function () { debugger
                     var id = $("input", this).attr('id');
                     var coresId = id.replace('C1', 'C2');
                     $('#' + coresId).removeAttr("checked");
                     $('#C1All').removeAttr("checked");
                     $('#C2All').removeAttr("checked");
                 });
             });

             $('.col2').each(function () { 
                 $(this).click(function () {debugger
                     var id = $("input", this).attr('id');
                     var coresId = id.replace('C2', 'C1');
                     $('#' + coresId).removeAttr("checked");
                     $('#C1All').removeAttr("checked");
                     $('#C2All').removeAttr("checked");
                 });
             });
         });

  </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:GridView ID="gv" runat="server" AutoGenerateColumns="False" DataKeyNames="Id"
        OnRowDataBound="gv_RowDataBound">
        <Columns>
         <asp:TemplateField HeaderText="Approve" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" >
            <HeaderTemplate>
                Approve<br />
                <asp:CheckBox ID="C1All" runat="server"  />
            </HeaderTemplate>
            <ItemStyle HorizontalAlign="Center" />
            <ItemTemplate   >
                <asp:CheckBox CssClass="col1" ID="chkApprove" runat="server"  >
                </asp:CheckBox>
            </ItemTemplate>
            <HeaderStyle HorizontalAlign="Center" />
        </asp:TemplateField>
         <asp:TemplateField HeaderText="Reject" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="180px">
            <HeaderTemplate>
                Reject<br />
                <asp:CheckBox ID="C2All"  runat="server"  />
                 <asp:DropDownList ID="drpPaymentMethod" runat="server">
                        <asp:ListItem Value="-1">Please select</asp:ListItem>
                        <asp:ListItem Value="0">Month</asp:ListItem>
                        <asp:ListItem Value="1">At End</asp:ListItem>
                        <asp:ListItem Value="2">At Travel</asp:ListItem>
                    </asp:DropDownList>
            </HeaderTemplate>
            <ItemStyle HorizontalAlign="Center" />
            <ItemTemplate> 
                <div class="selectReason">
                    <asp:CheckBox CssClass="col2"  ID="chkReject" runat="server" >
                    </asp:CheckBox>
                     <asp:DropDownList ID="drpPaymentMethod" runat="server">
                        <asp:ListItem Value="-1">Please select</asp:ListItem>
                        <asp:ListItem Value="0">Month</asp:ListItem>
                        <asp:ListItem Value="1">At End</asp:ListItem>
                        <asp:ListItem Value="2">At Travel</asp:ListItem>
                    </asp:DropDownList>
                </div>
            </ItemTemplate>
            <HeaderStyle HorizontalAlign="Center" />
        </asp:TemplateField>
            <asp:BoundField DataField="ID" ControlStyle-Width="250px" HeaderText="ID" SortExpression="ID" />
            <asp:BoundField DataField="FirstName" ControlStyle-Width="250px" HeaderText="FirstName"
                SortExpression="FirstName" />
            <asp:BoundField DataField="LastName" ControlStyle-Width="250px" HeaderText="LastName"
                SortExpression="LastName" />
            <asp:TemplateField>

            </asp:TemplateField>

        </Columns>
    </asp:GridView>

    </div>
    </form>
</body>
</html>
4

1 回答 1

0

这与控件如何呈现给浏览器有关。因此，基于此，您将需要修改 jQuery 元素选择器。在您的情况下，GridView正在发生的事情是，而不是C1All和C2All现在是gv_C1All和gv_C2All。在复选框的情况下，这次您需要将单词替换为 and viseverse，而不是替换C1为and visevers。这是修改后的 jQuery。现在它应该可以工作了。C2ApproveReject

我建议您在浏览器中查看页面 HTML，以便了解控件的呈现方式（您可以在 InternetExplorer 中按功能键 F12 以查看开发人员工具窗格，您可以在其中看到 HTML 树）

 $(document).ready(function () {
    $('#gv_C1All').click(function () {
        $('.col1 > input').attr("checked", $('#gv_C1All').attr("checked"));
        $('.col2 > input').removeAttr("checked");
        $('#gv_C2All').removeAttr("checked");
    });

    $('#gv_C2All').click(function () {
        $('.col2 > input').attr("checked", $('#gv_C2All').attr("checked"));
        $('.col1 > input').removeAttr("checked");
        $('#gv_C1All').removeAttr("checked");
    });

    $('.col1').each(function () {
        $(this).click(function () {
            var id = $("input", this).attr('id');
            var coresId = id.replace('Approve', 'Reject');
            $('#' + coresId).removeAttr("checked");
            $('#gv_C1All').removeAttr("checked");
            $('#gv_C2All').removeAttr("checked");
        });
    });

    $('.col2').each(function () {
        $(this).click(function () {
            var id = $("input", this).attr('id');
            var coresId = id.replace('Reject', 'Approve');
            $('#' + coresId).removeAttr("checked");
            $('#gv_C1All').removeAttr("checked");
            $('#gv_C2All').removeAttr("checked");
        });
    });
});
于 2012-05-16T03:41:10.197 回答