Question

使用gridview中的复选框。我想使用jquery检查并取消选中gridview中的复选框。我用live方法尝试了这个。它适用于gridview中的第一页，但不适用于页面索引更改事件。

 $(document).ready(function () {

        var checkBoxSelector = '#<%=grv_ClientList.ClientID%> input[id*="chck_itemSelect"]:checkbox';

        //header checkbox
        $('[id$=chck_headSelect]').live("click", function () {

            if ($(this).is(":checked")) {

                $(checkBoxSelector).attr('checked', true);

            }
            else {

                $(checkBoxSelector).attr('checked', false);
            }
        });

    });

Answer 1

请仔细阅读示例代码。

<script src="jquery-1.4.1.js" type="text/javascript"></script>

<script src="jquery-1.4.1-vsdoc.js" type="text/javascript"></script>



<script type="text/javascript" >

    $(document).ready(function() {

    var ab = 0 ;

        $("[id$=myCheck]").click(function() {



            if (ab == 0) {

                $('#<%=GridView1.ClientID %> >tbody >tr >td:first-child > input:checkbox').attr('checked', true);

                ab = 1;

            }

            else {

                $('#<%=GridView1.ClientID %> >tbody >tr >td:first-child > input:checkbox').attr('checked', false);

              ab =0 ;

            }



        })

    })



</script>

        <Columns>



            <asp:TemplateField>

            <HeaderTemplate>

            <asp:CheckBox ID="myCheck" runat="server"   />

            </HeaderTemplate>

            <ItemTemplate><asp:CheckBox ID="urCheck" runat="server" /></ItemTemplate>



            </asp:TemplateField>





            <asp:BoundField DataField="UnitName" HeaderText="Unit Name" />

            <asp:BoundField DataField="Description" HeaderText="Description" />

            <asp:TemplateField HeaderText="Status">

            <ItemTemplate>



            <asp:DropDownList ID="AttendId" runat="server"    >

            <asp:ListItem  style="Color:Green" Text="Present" Value="0"></asp:ListItem>

            <asp:ListItem  style="Color:Red" Text="Absent" Value="1"></asp:ListItem>

            <asp:ListItem  style="Color:Blue" Text="Leave" Value="2"></asp:ListItem>



            </asp:DropDownList>



            </ItemTemplate>              

            </asp:TemplateField>

        </Columns>

    </asp:GridView>

Answer 2

您可以通过遍历gridview的每个复选框来执行此操作，如：

<script type="text/javascript"> 
function CheckUnCheckAll(chk) { 
 $('#<%=GridView1.ClientID %>').find("input:checkbox").each(function () { 
  if (this != chk) { 
      this.checked = chk.checked; 
    } 
   }); 
  } 
</script>

检查示例：http://www.codegateway.com/2012/05/jquery-check-uncheck-all-checkboxes-in.html

使用jQuery检查并取消选中Asp.net GridView中的复选框

2 个答案: