当前位置:编程学习 > C#/ASP.NET >>

GridView中实现全选完成批量审批或批量删除

在ASP.NET中,我们会经常使用到GridView,在进行一些操作时,比如对选择项进行删除等操作,这个时候我们会添加复选框,如果我们想批量删除,该怎么办呢?
首先,我们需要在页面中添加一个隐藏域用来存储每行数据对应的ID:
[csharp]  
<asp:HiddenField ID="hdfWPBH" runat="server" />  
下面是用来显示数据的GridView:
[csharp]  
<asp:GridView ID="GridView2" SkinID="GridView1" DataKeyNames="ID"   
                            runat="server" onrowdatabound="GridView2_RowDataBound">  
   <RowStyle BackColor="#f2f2f2" />  
   <AlternatingRowStyle BackColor="#DCEEFA" />  
   <Columns>  
      <asp:TemplateField HeaderText="序号">  
         <HeaderTemplate>  
           <input type="checkbox" name="BoxIdAll" id="BoxIdAll" onclick="onclicksel();" />  
         </HeaderTemplate>  
         <ItemTemplate>  
           <input id="BoxId" name="BoxId" value='<%#(Convert.ToString(Eval("ID")))%>' type="checkbox" />  
         </ItemTemplate>  
         <ItemStyle Height="25px" HorizontalAlign="Center" />  
         <HeaderStyle Width="3%" Height="28px" BackColor="#80B4CF" HorizontalAlign="Center" />  
       </asp:TemplateField>  
       <asp:TemplateField HeaderText="序号">  
         <ItemTemplate>  
            <font color="#000000" style="font-size: 10px">  
                <%#GetCountCK()%>  
            </font>  
         </ItemTemplate>  
         <ItemStyle Height="30px" HorizontalAlign="Center" />  
         <HeaderStyle Width="5%" Height="30px" BackColor="#80B4CF" HorizontalAlign="Center" />  
       </asp:TemplateField>  
       <asp:TemplateField HeaderText="物品名称">  
         <ItemTemplate>  
            <%#strTrim(Convert.ToString(Eval("WPMC")))%>  
         </ItemTemplate>  
         <ItemStyle HorizontalAlign="Center" />  
           <HeaderStyle Width="13%" HorizontalAlign="center" BackColor="#80B4CF" />  
       </asp:TemplateField>  
   </Columns>  
</asp:GridView>  
还有一个用来完成审核的按钮:
[csharp] 
<asp:ImageButton ID="imgAuditPass" runat="server" BorderColor="#FFCCCC"   
                BorderStyle="Solid" BorderWidth="1px" ImageUrl="~/CWQLC/images/sure.png"   
                onclick="imgAuditPass_Click" ToolTip="点此完成信息审核" OnClientClick='return batchAudit(this.id)' />  www.zzzyk.com
 
效果图如下:
还需要添加一些Javascript代码:
Header区域的那个实现全选功能的复选框事件:
[javascript] 
function onclicksel()  
{  
   var chkobj = document.getElementById("BoxIdAll");  
   if(chkobj.checked == true)  
   {  
      selAll();  
   }  
   else  
   {  
      removeAll();  
   }  
}  
 
以下是调用的一些函数:
[javascript] 
function selAll()  
{  
  var selobj = document.getElementsByName("BoxId");  
  for(var i = 0; i < selobj.length; i++)  
  {  
    if (!selobj[i].disabled)  
    {  
      selobj[i].checked = true;  
    }  
  }  
}  
      
function removeAll()  
{  
   var selobj = document.getElementsByName("BoxId");  
   for(var i = 0; i < selobj.length; i++)  
   {  
      selobj[i].checked = false;  
   }  
}  
“审核通过"按钮的客户端事件(OnClientClick='return batchAudit(this.id)')实现客户端验证,Javascript代码:
[javascript] 
function batchAudit(id)  
{  
   var AuditVal = "";  
   var bid = document.getElementsByName("BoxId");  
   for(var i = 0; i < bid.length; i++)  
   {  
       if(bid[i].checked == true)  
       {  
          AuditVal = AuditVal + bid[i].value + ",";  
       }  
    }  
    if(AuditVal.length <= 0)  
    {  
        alert("请先选择要审核的项");  
        return false;  
    }  
    else  
    {  
        if(id == "btnDelete")  
        {  
          if(confirm("您确认要审核吗?"))  
          {  
             document.getElementById("hdfWPBH").value = AuditVal;  
             return true;  
          }  
          return false;  
         }  
     }  
}  
补充:软件开发 , C# ,
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,