ModalPopupExtender 控件功能描述
以模式窗口的方式弹出客户或服务器控件 , 以突出显示 ! 弹出的一般是 DIV 或 PANEL.
ModalPopupExtender控件属性描述
TargetControlID : 控制是否弹出的控件的 ID.(此控件点击将不会触发postbcak)。
PopupDragHandleControlID : 允许拖拽的控件的 ID.
PopupControlID: 指定要弹出的控件的 ID.
BackgroundCssClass: 指定弹出控件后其它内容的样式 .
DropShadow: 弹出的控件是否有阴影效果
. OkControlID: 确认按钮的 ID.
OnOkScript : 单击[确认]按钮时要执行的脚本方法
CancelControlID : 取消按钮的
ID. OnCancelScript : 单击[取消]按钮时要执行的脚本方法 .
X,Y : 指定弹出层的位置 .
RepositionMode : 指示当页面窗口调整大小或滚动时, 弹出层是否要进行位置移动 .
示例代码
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<style type="text/css">
.modalPopup
{
background-color: White;
border: 2px solid silver;
width: 400px;
height: 300px;
}
.modalPopuptitle
{
height: 45px;
background: #ebebeb;
position: relative;
overflow: hidden;
width: 100%;
}
.modalBackground
{
background-color: Gray;
filter: alpha(opacity=50);
opacity: 0.5;
}
</style>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<ajaxToolkit:ModalPopupExtender runat="server" PopupControlID="pnlSignUpPopup" ID="mdleEmailSignUp"
CancelControlID="btnCancel" OkControlID="btnhidden" TargetControlID="btnshowmodel"
PopupDragHandleControlID="pnlSignUpPopup" BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="pnlSignUpPopup" runat="server" CssClass="modalPopup">
<div class="modalPopuptitle">
<label style="height: 45px">
User Login</label>
</div>
<div style="text-align: center; margin-top: 10px">
<p>
<asp:Label ID="labusername" runat="server" Text="User Name:" Width="100px"></asp:Label>
<asp:TextBox runat="server" Height="28px" Style="margin-top: 0px; margin-bottom: 0px"
Width="193px"></asp:TextBox></p>
<p>
<asp:Label ID="labpassword" runat="server" Text="PassWord:" Width="100px"></asp:Label>
<asp:TextBox runat="server" Height="28px" Style="margin-top: 0px; margin-bottom: 0px"
Width="193px" TextMode="Password">
</asp:TextBox>
</p>
<p>
<asp:Button runat="server" ID="btnhidden" Text="OK" />
<asp:Button runat="server" ID="btnCancel" Text="Cancel" />
</p>
</div>
</asp:Panel>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Button ID="btnshowmodel" runat="server" Text="show model" OnClick="bunshowmodal_Click" />
</asp:Content>