zoukankan      html  css  js  c++  java
  • GridView全选和反选用JQuery实现(转)

    <asp:GridView ID="grid" runat="server" AutoGenerateColumns="false" GridLines="Horizontal"
    OnPreRender
    ="grid_PreRender">
    <Columns>
    <asp:TemplateField>
    <HeaderTemplate>
    <input type="checkbox" id="chkAll" />
    </HeaderTemplate>
    <ItemTemplate>
    <input type="checkbox" id="chkItem" code='<%# Eval("Code") %>' />
    </ItemTemplate>
    </asp:TemplateField>
    <asp:BoundField DataField="Code" HeaderText="Code" HtmlEncode="true" />
    <asp:BoundField DataField="Name" HeaderText="Name" HtmlEncode="true" />
    <asp:BoundField DataField="Age" HeaderText="Age" HtmlEncode="true" />
    <asp:BoundField DataField="Address" HeaderText="Address" HtmlEncode="true" />
    </Columns>
    </asp:GridView>
    //全选/反选
    $("#chkAll").click(function () {
    $('#<%=grid.ClientID %> > tbody > tr > td > input:checkbox').attr("checked", this.checked);
    });

    //若所有tbody中的项都选中了,自动将表头中的chkAll选中.
    $("#<%=grid.ClientID %> > tbody > tr > td > input:checkbox").click(function () {
    //获取所有选中的checkbox元素
    var expression1 = $("#<%=grid.ClientID %> > tbody > tr > td > input:checkbox:checked");
    //获取所有checkbox元素
    var expression2 = $("#<%=grid.ClientID %> > tbody > tr > td > input:checkbox");
    var hasChecked = $(expression1).length == $(expression2).length;
    $("#chkAll").attr("checked", hasChecked);
    });

    //获取表格中选中的值
    $("#btnGetByGridCheckedElement").click(function () {
    var selectedCodes = new Array();
    var checkedItems = $("#<%=grid.ClientID %> > tbody > tr > td > input:checkbox:checked[@name$='chkItem']");
    $.each(checkedItems, function () {
    selectedCodes.push(this.code);
    });
    if (0 == selectedCodes.length) {
    alert("没有选中任何项..");
    return;
    }
    alert(selectedCodes.join(","));
    });



  • 相关阅读:
    收藏:iBLC编码器
    蛙蛙推荐:怎样调试asp.net黄页错
    蛙蛙推荐:IE下3px bug研究
    蛙蛙推荐:winform入门
    蛙蛙推荐:蛙蛙牌云存储服务
    整理:个人知识管理相关链接
    蛙蛙推荐:c#编写网络电话
    蛙蛙推荐:蛙蛙教你解析网络包
    有用的SQL 语句(转) dodo
    .net 点击刷新验证码问题 dodo
  • 原文地址:https://www.cnblogs.com/shenyixin/p/2298413.html
Copyright © 2011-2022 走看看