2013-04-05 23 views
0

结合中继contron后处理Repeater控件中的CheckBoxList,我的复选框看起来像下面,使用asp.net

我这里有两个疑惑..

1 - 如果我选择第1组的复选框,应选择组1下的所有项目。我怎样才能做到这一点 ?

2 - 我有“全选”按钮,点击时应选择所有组的所有项目。由于复选框位于中继器控制器内部,因此我不确定如何处理它。请帮助

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> 
+0

不知道,但:对的onclick ASP对象是指服务器端...尝试的OnClientClick ... – MaxOvrdrv 2013-04-05 01:47:48

回答

1

你需要从直放站ItemDataBound事件添加复选框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和来回调用它m按钮单击事件

function selectAll() { 

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

按钮形式调用函数

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