使用asp.net处理Repeater控件中的复选框列表答案

【问题标题】：Handling checkboxlist inside Repeater control using asp.net使用asp.net处理Repeater控件中的复选框列表
【发布时间】：2018-07-19 14:41:54
【问题描述】：

绑定repeater控件后，我的复选框如下图，

我这里有两个疑问：

如果我选中第 1 组的复选框，则应选中第 1 组下的所有项目。我怎样才能做到这一点？
我有“全选”按钮，单击该按钮应选择所有组的所有项目。由于复选框在中继器控件内，我不确定如何处理。

  Group 1
       Item 1
       Item 2

    Group 2
       Item 3
       Item 4

    Group 3
       Item 5 
       Item 6




  ASPX : 

    <ol>
        <asp:Repeater ID="rp_Groups" runat="server" OnItemDataBound="rp_Groups_ItemDataBound">
            <ItemTemplate>
                <ul>
                    <asp:CheckBox RepeatColumns="2" runat="server" ID="chk_Group" Text='<%# Eval("category_type") %>' Value='<%# Eval("service_type_category_id") %>' onclick="OnGroupClick" />

                     <asp:CheckBoxList runat="server" ID="chkServiceType" style="padding-left:20px" DataValueField="ServiceTypeID" DataTextField="Name" EnableViewState="true"
                     ></asp:CheckBoxList>

                  <br />
                </ul>
            </ItemTemplate>
        </asp:Repeater>
    </ol>

<script type="text/javascript">
    function OnGroupClick(group) { 
  for(item in group.getElementsByTagName('input')) {
     item.checked = group.checked;
  }
}

   function selectAll() {
        $("#<%=chkServiceType.ClientID %> input[type=checkbox]").each(function () {
            this.checked = true;
        })
    }
</script>

【问题讨论】：

不确定但是：对于 ASP 对象的 onclick 意味着服务器端...尝试 onclientclick...

标签： javascript asp.net .net repeater

【解决方案1】：

您需要在repeater Itemdatabound 事件中添加checkbox onclick 事件，如下所示调用JavaScript 函数。

protected void rp_Groups_ItemDataBound(object sender, RepeaterItemEventArgs e)
    {
         try
        {
            System.Web.UI.WebControls.CheckBox chk =  (System.Web.UI.WebControls.CheckBox)e.Item.FindControl("chk_Group");

            chk.Attributes.Add("onclick", "selectGroupAll("+chk.ClientID+");");
        }
         catch (Exception ex)
         {

         }

    }

那你需要用 JavaScript 写函数

1）选择组复选框的功能（我从后面的页面传递复选框组的客户端ID。现在我找到属于一个组的所有复选框并将它们选中。）

function selectGroupAll(chk) {         


            $(chk).parent().parent().find(":checkbox").attr("checked", true);

        }

2) 按钮单击时全选

用 JavaScript 编写函数并从按钮点击事件中调用它

function selectAll() {

            $(':checkbox').each(function () {
                this.checked = true;
            });
        }

按钮窗体调用函数

 <input type="button" value="Test" onclick="selectAll();" />

【讨论】：