ajaxToolkit:ModalPopupExtender演示及实现代码

所属分类: 网络编程 / ASP.NET 阅读数: 483
收藏 0 赞 0 分享
ajaxToolkit:ModalPopupExtender可以让用户模拟新开一个窗口,以下演示,就是在模拟新开窗口作多项选项的功能。
 
演示例子中,是Repeater结合CheckBox进行多选,此功能实现,可以参考:https://www.jb51.net/article/33558.htm

选择的小图片,它将要被ajaxToolkit:ModalPopupExtender使用,因为需要设为服务控件,添加runat="server":
复制代码 代码如下:

<img id="ab" runat="server" style="margin-left: 5px; margin-bottom: 30px;"
src="../Image/ab.gif" width="18" height="18" />

下面是Popup窗口的Html,不过Insus.NET已经省略了Repeater控件内的内容,你在应用时,需要添加的你自己的,还是就是btnSelected_Click事件。
复制代码 代码如下:

<asp:Panel ID="pnlPopupWindown" runat="server" Style="display: none; background-color: #ffffdd;
border-width: 3px; border-style: solid; border-color: Gray; padding: 3px; width: 500px;">
<asp:Panel ID="Panel3" runat="server" Style="float: left; margin-bottom: 5px; cursor: move;
background-color: #DDDDDD; border: solid 1px Gray; color: Black; height: 20px;
width: 475px; text-align: center; line-height: 20px;">
邮件地址列表
</asp:Panel>
<asp:Panel ID="Panel4" runat="server" Style="float: right; margin-bottom: 5px; background-color: #DDDDDD;
border: solid 1px Gray; color: Black; height: 20px; text-align: center; line-height: 20px;">
<asp:LinkButton ID="btnClose" runat="server" Style="margin-right: 4px; margin-left: 4px;"
OnClientClick="return false;" Text="×" ForeColor="Red" ToolTip="Close" />
</asp:Panel>
<div>
<asp:Panel ID="Panel1" runat="server" ScrollBars="Vertical" Height="198px" Width="100%"
BorderStyle="Solid" BorderWidth="1px" BorderColor="Gray">
<asp:Repeater ID="RepeaterEmailList" runat="server">
</asp:Repeater>
</asp:Panel>
<div style="height: 3px;">
</div>
<asp:Panel ID="Panel2" runat="server">
<asp:Button ID="btnSelected" runat="server" OnClick="btnSelected_Click" Text="插入"
CausesValidation="false" CssClass="button" />
</asp:Panel>
</div>
</asp:Panel>
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="ab"
PopupControlID="pnlPopupWindown" BackgroundCssClass="modalBackground" CancelControlID="btnClose"
DropShadow="true" PopupDragHandleControlID="Panel3" />
<script type="text/javascript">
function setBodyHeightToContentHeight() {
document.body.style.height = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight) + "px";
}
setBodyHeightToContentHeight();
$addHandler(window, "resize", setBodyHeightToContentHeight);
</script>

最后是CSS样式
复制代码 代码如下:

/*Modal Popup*/
.modalBackground
{
background-color: Gray;
filter: alpha(opacity=70);
opacity: 0.7;
}
更多精彩内容其他人还在看

运行page页面时的事件执行顺序及页面的回发与否深度了解

page页面时的事件执行顺序的了解对于一些.net开发者起到者尤关重要的作用;页面的回发与否会涉及到某些事件执行与不执行,在本文中会详细介绍,感兴趣的朋友可以了解下
收藏 0 赞 0 分享

Web.config(应用程序的配置信息)总结

Web.config文件是一个XML文本文件,它用来储存 ASP.NET Web 应用程序的配置信息(如最常用的设置ASP.NET Web 应用程序的身份验证方式),它可以出现在应用程序的每一个目录中,接下来详细介绍一下配置情况,感兴趣的朋友可以了解下
收藏 0 赞 0 分享

C#时间格式化(Datetime)用法详解

C#时间格式化Datetime.ToString参数format格式详细用法,本文将进行介绍,感兴趣的朋友可以了解下啊
收藏 0 赞 0 分享

实现onmouseover和onmouseout应用于RadioButtonList或CheckBoxList控件上

一直想实现onmouseover和onmouseout应用于RadioButtonList或CheckBoxList控件上。此功能就是当鼠标经过时RadioButtonList或CheckBoxList每一个Item时,让Item有特效显示,离开时,恢复原样有演示动画,感兴趣的朋
收藏 0 赞 0 分享

Asp.net 图片文件防盗链(尊重劳动成果)及BeginRequest事件学习

关于图片盗链这个问题,毕竟是自己的劳动成功,很多人不希望别人就那么轻易地偷走了;反盗链的程序其实很简单,熟悉ASP.NET 应用程序生命周期的话很容易就可以写一个,运用HttpModule在BeginRequest事件中拦截请求就ok了
收藏 0 赞 0 分享

asp.net Grid 导出Excel实现程序代码

看了FineUI中的将Grid导出为Excel的实现方法,实际上是可以非常简单。看来很难的问题,变换一种思路就可以非常简单
收藏 0 赞 0 分享

使用C#处理WebBrowser控件在不同域名中的跨域问题

我们在做web测试时,经常会使用WebBrowser来进行一些自动化的任务而有些网页上面会用IFrame去嵌套别的页面,这些页面可能不是在相同域名下的,这时就会出现跨域问题,无法直接在WebBrowser中获取到IFrame中的元素,接下来介绍如何解决此问题,需要了解的朋友可以参
收藏 0 赞 0 分享

.NET 下运用策略模式(组合行为和实体的一种模式)

我简单的理解策略模式就是把行为(方法)单独的抽象出来,并采用组合(Has-a)的方式,来组合行为和实体的一种模式比如,.NET中对数组排序的Sort的方法就是一个策略模式的实现模板
收藏 0 赞 0 分享

使用Entity Framework(4.3.1版本)遇到的问题整理

在这里记录一下之前使用Entity Framework(4.3.1版本)遇到的问题:更新没有设置主键的表、更改Code-First的默认连接、检测字符串截断错误,需要的朋友可以参考下
收藏 0 赞 0 分享

Asp.net利用JQuery AJAX实现无刷新评论思路与代码

Asp.net利用JQuery AJAX实现无刷新评论,此功能是每一个从事asp.net开发者的朋友都希望实现的,本文利用闲暇时间整理了一些,有需要的朋友可以参考下
收藏 0 赞 0 分享
查看更多