您的位置：首页 > 其它

AjaxControlToolKit之ConfirmButton效果用法

2008-02-15 17:06 405 查看

1、将控件ToolkitScriptManager拖至页面中...
2、将控件UpdatePanel拖到页面中作为容器，以实现无刷新的效果...
3、添加Button，ID为"LinkButton1"...
4、添加ConfirmButtonExtender控件，设置该控件TargetControlID为LinkButton1
5、添加ModalPopupExtender控件，设置该控件TargetControlID为LinkButton1
6、查看LinkButton1的Extenders属性，详细设置ConfirmButtonExtender控件和ModalPopupExtender控件的其他必要参数。
设置ConfirmButtonExtender的DisplayModalPopupID为ModalPopupExtender控件ID；OnClientCancel:指定在客户端实现“取消”按钮事件的方法名。
设置ModalPopupExtender的属性：
CancelControlID为弹出页面中“取消”按钮ID，用于指示当用户点击弹出框中取消按钮时所做的事情。
OkControlID为弹出页面中“确定”按钮ID，用于指示当用户点击弹出框中确定按钮时所做的事情。
PopupControlID：指定弹出控件Panel的ID。
最后设定样式：BackgroundCssClass="modalBackground“

具体实现代码如下：

<body>
</script>
<form id="form1" runat="server">
<div>
<cc1:toolkitscriptmanager id="ToolkitScriptManager1" runat="server"></cc1:toolkitscriptmanager>
<asp:UpdatePanel id="UpdatePanel1" runat="server">
<contenttemplate>
<asp:DataGrid ID="DataGrid1" runat="server" AutoGenerateColumns="False" ShowFooter="True"
Width="320px">
<Columns>
<asp:TemplateColumn FooterText="编号" HeaderText="编号">
<ItemTemplate>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn FooterText="value值" HeaderText="value值">
<ItemTemplate>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn FooterText="text值" HeaderText="text值">
<ItemTemplate>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn FooterText="编辑" HeaderText="编辑">
<ItemTemplate>
<cc1:modalpopupextender id="ModalPopupExtender1" runat="server" targetcontrolid="LinkButton1" CancelControlID="ButtonCancel" OkControlID="ButtonOk" PopupControlID="PNL" BackgroundCssClass="modalBackground"></cc1:modalpopupextender>
<cc1:confirmbuttonextender id="ConfirmButtonExtender1" runat="server" displaymodalpopupid="ModalPopupExtender1"
targetcontrolid="LinkButton1" OnClientCancel="cancelClick"></cc1:confirmbuttonextender>
<asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click">编辑</asp:LinkButton>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
<asp:Panel ID="PNL" runat="server" Style="border-right: black 2px solid; padding-right: 20px;
border-top: black 2px solid; display: none; padding-left: 20px; padding-bottom: 20px;
border-left: black 2px solid; width: 200px; padding-top: 20px; border-bottom: black 2px solid;
background-color: white">
Are you sure you want to click the Button?
<br />
<br />
<div style="text-align: right">
<asp:Button ID="ButtonOk" runat="server" Text="OK" />
<asp:Button ID="ButtonCancel" runat="server" Text="Cancel" />
</div>
</asp:Panel><BR /> <asp:Label ID="Label1" runat="server" CssClass="lvjing" Font-Size="XX-Large" Height="57px" Text="暂无字" Width="707px"></asp:Label>
</contenttemplate>
</asp:UpdatePanel>
</div>
</form>
<br />
<br />
</body>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航