解决的问题:在删除操作的时候都会用到先弹出一个提示信息,询问用户是否要真正的进行删除,用的最多的就是用js的confirm函数
用这个函数优点就是现实简单,缺点是:不美观
本文就是为了美化confirm而写的一篇文章
用到的js特效代码下载地址为:http://download.csdn.net/detail/wangsky2/3909680
大体思想:在GridView删除操作模板中创建一个要执行操作的服务器控件button和一个a标记。
其中asp:button按钮设置为不可见,a标记用于执行js脚本,在js脚本执行中调用button的后台执行操作
代码如下:
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="True">
<ContentTemplate>
<asp:GridView ID="gvList" runat="server" AutoGenerateColumns="False" Width="100%"
CssClass="table break" AllowPaging="True" OnDataBound="gvList_DataBound"
OnRowDataBound="gvList_RowDataBound" OnRowCommand="DelChildUserOrDevice"
DataKeyNames="Id,DevId" OnRowCancelingEdit="gvList_RowCancelingEdit"
OnRowEditing="gvList_RowEditing"
OnRowUpdating="gvList_RowUpdating" ShowHeaderWhenEmpty="True" GridLines="None"
CellPadding="4" ForeColor="#333333">
<Columns>
其它数据绑定操作。。。。。。
<asp:TemplateField HeaderText="操作">
<ItemTemplate>
<asp:Button ID="btnDelDevice" CommandName="DelDevice" runat="server" Text="Button" CommandArgument="<%#Container.DataItemIndex%>" style="display: none"/>
<a href="javascript:DeldeviceRow(<%#Container.DataItemIndex%>);">删除</a>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
我这里在删除是时候用到了updatePanel,实现简单的异步刷新操作
js代码:
start 删除设备信息
var deviceDelRowIndex; //删除设备的当前行索引
//删除设备的回调函数
function deviceDelrowCallBack(tp) {
if (tp == 'ok') {
var GridView = document.getElementById("<%=gvList.ClientID %>");
GridView.rows[deviceDelRowIndex].cells[4].getElementsByTagName("input")[0].click();
}
}
//删除设备的函数
function DeldeviceRow(rowIndex) {
ymPrompt.confirmInfo('确认要删除此行吗?', null, null, '消息', deviceDelrowCallBack);
deviceDelRowIndex = rowIndex + 1;
}
///end 删除设备信息
后台删除操作代码:
protected void DelChildUserOrDevice(object sender, GridViewCommandEventArgs e)
{
具体代码。。。。。。。。
}