Monday, August 24, 2009

Call ModalPopupExtender from Codebehind in .net

<head runat="server">
<title>Untitled Page</title>
<script>
function PopupModal ()
{
var modal = $find('modalPopupExtender1');

if (modal)
{
if (modal.show)
{
modal.show();
}
else
{
alert("nope!");
}
}
else
{
throw modal;
}
}
function onOk()
{
}
</script>
</head>
<body>
<form id="form1" runat="server">

<asp:ScriptManager runat="server" ID="ScriptManager1" EnablePageMethods="true" LoadScriptsBeforeUI="true"> </asp:ScriptManager>
<asp:Button ID="button1" runat="server" Text="Server_Click" OnClick="button1_Click" />
<asp:Button ID="buttonNull" style="display:none;" runat="server" />
<asp:UpdatePanel ID="updPanel1" runat='server'></asp:UpdatePanel>

<asp:Panel runat="server" ID="Panel1" Width="500" Height="500" style="display:none;"
BackColor="#fafad2" BorderColor="black" BorderStyle="solid" BorderWidth="1px">

<asp:panel runat="server" ID="Panel3" Width="100%" Height="27" BackColor="red">
DragHandle
</asp:panel>

<asp:Button ID="OKButton" runat="server"/>
<asp:button ID="CancelButton" runat="server" />
</asp:Panel>

<cc1:ModalPopupExtender ID="ModalPopupExtender" runat="server"
BehaviorID="modalPopupExtender1"
TargetControlID="buttonNull"
PopupControlID="Panel1"
BackgroundCssClass="modalBackground"
OkControlID="OkButton"
OnOkScript="onOk()"
CancelControlID="CancelButton"
DropShadow="true"
PopupDragHandleControlID="Panel3" />



Here is the code behind:

protected void button1_Click(object sender, EventArgs e)
{
//Do stuff

ScriptManager.RegisterStartupScript(this, this.GetType(), "ShowPopup", "window.setTimeout('PopupModal()',50);", true);
}