在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.2cto.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;
}
}
}
在後台.cs”審核通過“按鈕單擊事件(onclick="imgAuditPass_Click")C#代碼:
[csharp]
protected void imgAuditPass_Click(object sender, ImageClickEventArgs e)
{
string[] chkIds = null;
string batchRegroup = Request.Form["hdfWPBH"].ToString().Trim().TrimEnd(',');//通過這種方式來獲得前台隱藏域的內容
if (batchRegroup.Length != 0)
{
chkIds = batchRegroup.Split(',');
}
string sql = "";
for (int i = 0; i < chkIds.Length; i++)
{
sql = "UPDATE T_WPXX_CK SET SPR='" + userrealName + "' WHERE ID='" + chkIds[i] + "'";
wpck.auditOrDelete(sql);//傳入SQL語句並執行
}
ClientScript.RegisterStartupScript(this.GetType(), "pass", "alert('審核通過!');", true);
GridViewShow_CK();//GridView綁定數據顯示方法
}
這樣,只要單擊"審核通過"按鈕,就能把復選框所選中的那一行的ID放入隱藏域中,只要confirm("您確認要審核嗎?")選擇"是",即可調用後台的onclike事件並執行