如何实现Repeater控件中checkbox全选和反选?

时间:2022-01-22 17:40:21
在Repeater控件中绑定数据,每条数据前面有个复选框,并且分了页。如何实现全选和在不同页内反选。后能顺利提交数据。

8 个解决方案

#1


js啊

#2


<script language="javascript" type="text/javascript">

        function allcheck()
       {   var e = form1.elements;
            if(document.getElementById("all").checked)//全选处于checked
           {
                for (var i =0;i<e.length;i++)
                 {
                        if(e[i].name =="userid")
                        {
                            e[i].checked = true;
                        }
                 }
          }
          else//全选处于非checked
          {
                for (var i =0;i<e.length;i++)
                 {
                        if(e[i].name =="userid")
                        {
                            e[i].checked = false;
                        }
                 }
          } 
 
             
      }  
      
      //只能选一项
      function checkone()
      {
            var e = form1.elements;
            var num=0;
            for (var i =0;i<e.length;i++)
             {
           
                    if(e[i].name =="userid" && e[i].checked)
                    {
                     num++;
                    }
             }
             if (num != 1)
             {
                    alert("只能选择一项");
                     for (var i =0;i<e.length;i++)
                     {
                            if(e[i].name =="userid" && e[i].checked)
                            {
                                e[i].checked=false;
                            } 
                      } 
                    return false;
                    
             }
             
             if (!confirm("你确定提交吗"))
             {
                return false;
             }
            
           
      }
      
      //至少选一项
      function checkmany()
      {
        var e = form1.elements;
            var num=0;
            for (var i =0;i<e.length;i++)
             {
                    if(e[i].name =="userid" && e[i].checked)
                    {
                        num++;
                       break; 
                    }
             }
             if (num ==0)
             {
                    alert("至少选择一项");
                    return false;
             }
             
              if (!confirm("你确定提交吗"))
             {
                return false;
             }    
      }
     
   
   </script> 

#3


   参考:
http://www.phpchinaz.cn/c/ASPDotNET/52_5202_1237457136.html
http://hi.baidu.com/vcty2007/blog/item/b5055ee9cd35da38b80e2d36.html
http://www.cnblogs.com/dupeng0811/archive/2009/03/13/1410611.html

#4


我以前做的

<table cellpadding="0" cellspacing="1" class="border" align="center" width="99%">
        <tr>
            <td>
             &nbsp;<a href="User.aspx?type=add">新增管理员</a> | <a href="ChangePassword.aspx">修改密码</a> 
            </td>
           <td align="right">
            <script type="text/javascript">
            function SelectAll()
            { 
                  var s = $("tbReport").getElementsByTagName("INPUT")
                    for(var i=0;i<s.length;i++)
                    {
                        if(s[i].type=="checkbox")
                        {
                            s[i].checked=$("cbAll").checked;
                        }
                    }
            }   
           function CheckSelected()
          {
            var s = $("tbReport").getElementsByTagName("INPUT")
            var flag = false; 
            for(var i=0;i<s.length;i++)
            {
                if(s[i].type=="checkbox"&&s[i].checked)
                {
                    flag = true;
                }
            }
           if(!flag) 
          { 
            alert('请选择要删除的管理员信息');
            return false; 
           }
          else
          {
            return confirm('你确定要删除选择的管理员信息吗?');
          }  
          }  
            </script> 
           </td> 
        </tr>
    </table>  

    <table cellpadding="0" cellspacing="1" class="border" align="center" id="tbReport">
   <asp:Repeater ID="repReport" runat="server" OnItemCommand="repReport_ItemCommand">
   <HeaderTemplate>
        <tr class="title">
            <td width="1%">选择</td> 
            <td width="5%">编号</td>
            <td width="5%">管理员</td> 
            <td width="5%">权限</td>
            <td width="8%">操作</td> 
        </tr>
   </HeaderTemplate>
   <ItemTemplate>
        <tr class="tdbg" onMouseOver="this.className='tdbgmouseover'" onMouseOut="this.className='tdbg'">
          <td><asp:CheckBox ID="chk" runat="server" /></td> 
          <td><asp:Literal ID="litId" runat="server" Text='<%# Eval("OpID")%>'></asp:Literal></td>
          <td><%# Eval("OpName")%></td>
          <td><%# Eval("OpRight")%></td>
          <td>
          <asp:LinkButton ID="Close" runat="server" CommandName="close"  CommandArgument='<%# Eval("OpID")%>' Text="修改权限"/> |
          <asp:LinkButton ID="Delete" runat="server" CommandName="delete"  CommandArgument='<%# Eval("OpID")%>' Text="删除" OnClientClick="return confirm('确定要删除该管理员信息吗?')"/> 
          </td>
        </tr>
    </ItemTemplate> 
   </asp:Repeater>
   </table>
   <table width="99%" align="center" cellpadding="2" cellspacing="0" border="0">
    <tr>
        <td>
            <input type="checkbox" id="cbAll" onclick="SelectAll()"/><label for="cbAll">全选该页</label> <asp:Button ID="btnDelete" runat="server" Text="批量删除" cssclass="btn" OnClientClick="return CheckSelected();" OnClick="btnDelete_Click"/></td>
    </tr>
   </table>

#6


楼主给你一个简单的例子:

 protected void CheckBox1_CheckedChanged(object sender, EventArgs e)
        {
            foreach (RepeaterItem item in this.Repeater1.Items)
            {
                CheckBox checkBox = item.FindControl("CheckBox2") as CheckBox;
                checkBox.Checked = (sender as CheckBox).Checked;
            }
        }


<div>
    <table>
        <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1" 
            onitemcommand="Repeater1_ItemCommand">
        <HeaderTemplate>
        <tr>
             <td>
                 全选<asp:CheckBox ID="CheckBox1" runat="server" AutoPostBack=true OnCheckedChanged="CheckBox1_CheckedChanged" />
             </td>
        </tr>
        </HeaderTemplate>
        <ItemTemplate>
              <tr>
                   <td>
                       <asp:CheckBox ID="CheckBox2" runat="server" Text='<%#Eval("City") %>' />
                   </td>
              </tr>
        </ItemTemplate>
        </asp:Repeater>
        </table>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
            SelectCommand="SELECT top 10 [City] FROM [Customers]"></asp:SqlDataSource>
    </div>

当然js也是可以实现的。

#7


  抱歉我写的不够明确!
 我的现状是全选已经实现我是用个hidden来把所有页面上的数据放在其内,这是在数据绑定到repeater时同时写入该hidden内。但反选功能我还没能实现。反选我是用for来读取选中的,但只能读取当前页,如果跨页了(点其他页,后页面有刷新的),前面选定的内容就会清空。“选定的清空”,“只能读取当前页选定的数据”是我头疼的。
  忘高人指点1 2!!!

#8


kjhkjhjkgfhffdfgdf hjgfhjfhg[align=cen ter][/align]

#1


js啊

#2


<script language="javascript" type="text/javascript">

        function allcheck()
       {   var e = form1.elements;
            if(document.getElementById("all").checked)//全选处于checked
           {
                for (var i =0;i<e.length;i++)
                 {
                        if(e[i].name =="userid")
                        {
                            e[i].checked = true;
                        }
                 }
          }
          else//全选处于非checked
          {
                for (var i =0;i<e.length;i++)
                 {
                        if(e[i].name =="userid")
                        {
                            e[i].checked = false;
                        }
                 }
          } 
 
             
      }  
      
      //只能选一项
      function checkone()
      {
            var e = form1.elements;
            var num=0;
            for (var i =0;i<e.length;i++)
             {
           
                    if(e[i].name =="userid" && e[i].checked)
                    {
                     num++;
                    }
             }
             if (num != 1)
             {
                    alert("只能选择一项");
                     for (var i =0;i<e.length;i++)
                     {
                            if(e[i].name =="userid" && e[i].checked)
                            {
                                e[i].checked=false;
                            } 
                      } 
                    return false;
                    
             }
             
             if (!confirm("你确定提交吗"))
             {
                return false;
             }
            
           
      }
      
      //至少选一项
      function checkmany()
      {
        var e = form1.elements;
            var num=0;
            for (var i =0;i<e.length;i++)
             {
                    if(e[i].name =="userid" && e[i].checked)
                    {
                        num++;
                       break; 
                    }
             }
             if (num ==0)
             {
                    alert("至少选择一项");
                    return false;
             }
             
              if (!confirm("你确定提交吗"))
             {
                return false;
             }    
      }
     
   
   </script> 

#3


   参考:
http://www.phpchinaz.cn/c/ASPDotNET/52_5202_1237457136.html
http://hi.baidu.com/vcty2007/blog/item/b5055ee9cd35da38b80e2d36.html
http://www.cnblogs.com/dupeng0811/archive/2009/03/13/1410611.html

#4


我以前做的

<table cellpadding="0" cellspacing="1" class="border" align="center" width="99%">
        <tr>
            <td>
             &nbsp;<a href="User.aspx?type=add">新增管理员</a> | <a href="ChangePassword.aspx">修改密码</a> 
            </td>
           <td align="right">
            <script type="text/javascript">
            function SelectAll()
            { 
                  var s = $("tbReport").getElementsByTagName("INPUT")
                    for(var i=0;i<s.length;i++)
                    {
                        if(s[i].type=="checkbox")
                        {
                            s[i].checked=$("cbAll").checked;
                        }
                    }
            }   
           function CheckSelected()
          {
            var s = $("tbReport").getElementsByTagName("INPUT")
            var flag = false; 
            for(var i=0;i<s.length;i++)
            {
                if(s[i].type=="checkbox"&&s[i].checked)
                {
                    flag = true;
                }
            }
           if(!flag) 
          { 
            alert('请选择要删除的管理员信息');
            return false; 
           }
          else
          {
            return confirm('你确定要删除选择的管理员信息吗?');
          }  
          }  
            </script> 
           </td> 
        </tr>
    </table>  

    <table cellpadding="0" cellspacing="1" class="border" align="center" id="tbReport">
   <asp:Repeater ID="repReport" runat="server" OnItemCommand="repReport_ItemCommand">
   <HeaderTemplate>
        <tr class="title">
            <td width="1%">选择</td> 
            <td width="5%">编号</td>
            <td width="5%">管理员</td> 
            <td width="5%">权限</td>
            <td width="8%">操作</td> 
        </tr>
   </HeaderTemplate>
   <ItemTemplate>
        <tr class="tdbg" onMouseOver="this.className='tdbgmouseover'" onMouseOut="this.className='tdbg'">
          <td><asp:CheckBox ID="chk" runat="server" /></td> 
          <td><asp:Literal ID="litId" runat="server" Text='<%# Eval("OpID")%>'></asp:Literal></td>
          <td><%# Eval("OpName")%></td>
          <td><%# Eval("OpRight")%></td>
          <td>
          <asp:LinkButton ID="Close" runat="server" CommandName="close"  CommandArgument='<%# Eval("OpID")%>' Text="修改权限"/> |
          <asp:LinkButton ID="Delete" runat="server" CommandName="delete"  CommandArgument='<%# Eval("OpID")%>' Text="删除" OnClientClick="return confirm('确定要删除该管理员信息吗?')"/> 
          </td>
        </tr>
    </ItemTemplate> 
   </asp:Repeater>
   </table>
   <table width="99%" align="center" cellpadding="2" cellspacing="0" border="0">
    <tr>
        <td>
            <input type="checkbox" id="cbAll" onclick="SelectAll()"/><label for="cbAll">全选该页</label> <asp:Button ID="btnDelete" runat="server" Text="批量删除" cssclass="btn" OnClientClick="return CheckSelected();" OnClick="btnDelete_Click"/></td>
    </tr>
   </table>

#5


#6


楼主给你一个简单的例子:

 protected void CheckBox1_CheckedChanged(object sender, EventArgs e)
        {
            foreach (RepeaterItem item in this.Repeater1.Items)
            {
                CheckBox checkBox = item.FindControl("CheckBox2") as CheckBox;
                checkBox.Checked = (sender as CheckBox).Checked;
            }
        }


<div>
    <table>
        <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1" 
            onitemcommand="Repeater1_ItemCommand">
        <HeaderTemplate>
        <tr>
             <td>
                 全选<asp:CheckBox ID="CheckBox1" runat="server" AutoPostBack=true OnCheckedChanged="CheckBox1_CheckedChanged" />
             </td>
        </tr>
        </HeaderTemplate>
        <ItemTemplate>
              <tr>
                   <td>
                       <asp:CheckBox ID="CheckBox2" runat="server" Text='<%#Eval("City") %>' />
                   </td>
              </tr>
        </ItemTemplate>
        </asp:Repeater>
        </table>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
            SelectCommand="SELECT top 10 [City] FROM [Customers]"></asp:SqlDataSource>
    </div>

当然js也是可以实现的。

#7


  抱歉我写的不够明确!
 我的现状是全选已经实现我是用个hidden来把所有页面上的数据放在其内,这是在数据绑定到repeater时同时写入该hidden内。但反选功能我还没能实现。反选我是用for来读取选中的,但只能读取当前页,如果跨页了(点其他页,后页面有刷新的),前面选定的内容就会清空。“选定的清空”,“只能读取当前页选定的数据”是我头疼的。
  忘高人指点1 2!!!

#8


kjhkjhjkgfhffdfgdf hjgfhjfhg[align=cen ter][/align]