Repeater中CheckBox全选

最新推荐文章于 2019-03-31 17:52:10 发布

jht_saber

最新推荐文章于 2019-03-31 17:52:10 发布

阅读量427

点赞数

分类专栏： .NET

本文链接：https://blog.csdn.net/jht_saber/article/details/8706405

版权

.NET 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

前台代码：

<table class="stripe tableQuery" width="95%" cellpadding="0" cellspacing="0">
        <asp:Repeater ID="rpt" runat="server">
            <HeaderTemplate>
                <tr>
                    <th>
                    </th>
                </tr>
            </HeaderTemplate>
            <ItemTemplate>
                <tr>
                    <td>
                        <asp:CheckBox ID="cb_Id" runat="server"></asp:CheckBox>
                        <div style="display: none">
                            <asp:Label ID="lbl_Id" Text='<%# DataBinder.Eval(Container.DataItem,"ID") %>'
                                runat="server"></asp:Label></div>
                    </td>
                </tr>
            </ItemTemplate>
        </asp:Repeater>
</table>

<asp:CheckBox ID="cb_SelectCancel" runat="server" Text="全选/取消"></asp:CheckBox>

js：

function cb_All(cb_all) {
    var mySelectBox = document.getElementById(cb_all);
    var item = document.forms(0).elements;
    if (mySelectBox.checked == true) {
        for (var i = 0; i < item.length; i++) {
            if (item[i].type == 'checkbox' && item[i].disabled == false) { item[i].checked = true; }
        }
    }
    else {
        for (var i = 0; i < item.length; i++) {
            if (item[i].type == 'checkbox' && item[i].disabled == false) { item[i].checked = false; }
        }
    }
}

后台绑定onclick事件：

cb_SelectCancel.Attributes.Add("onclick", "cb_All('cb_SelectCancel')");

以上方法为实现页面中所有CheckBox的全选，当页面存在多个Repeater时，可使用jquery实现某一Repeater中CheckBox的全选：

function cb_Sel(cb_all) {
            var mySelectBox = document.getElementById(cb_all);
            var item = $("input[id*='rpt_cb_Id']");
            if (mySelectBox.checked == true) {
                for (var i = 0; i < item.length; i++) {
                    if (item[i].type == 'checkbox' && item[i].disabled == false) { item[i].checked = true; }
                }
            }
            else {
                for (var i = 0; i < item.length; i++) {
                    if (item[i].type == 'checkbox' && item[i].disabled == false) { item[i].checked = false; }
                }
            }
        }

其中$("input[id*='rpt_cb_Id']")为获取ID为rpt的Repeater中所有CheckBox集合，若存在多个Repeater则只需改变rpt为其他Repeater的ID即可。