articles

Home / DeveloperSection / Articles / AJAX Control Toolkit: ModalPopupExtender

AJAX Control Toolkit: ModalPopupExtender

Amit Singh 7245 29-Sep-2010

ModalPopupExtender use with ConfirmWindowExtender to show the confimation. The main key properties are:

  • TargetControlID
  • CancelControlID
  • OkControlID
  • PopupControlID

How we implement the ModalPopupExtender 

Step1: we use the following control on aspx page

 Example

 <div>
<%--Using ScriptManager or ToolkitScriptManager according toolkit version--%>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<%--Using ModalPopupExtender and set the properties--%>
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button1" CancelControlID ="btnCancel" OkControlID="btnOK" PopupControlID="Panel1">
</cc1:ModalPopupExtender>
<%--adding on button--%>
<asp:Button ID="Button1" runat="server" Text="Submit Page" />
<br />
<%--add the panel and two button--%>
<asp:PanelID="Panel1"runat="server"Style="display: none; background-color: White; width: 200; border-color: Black; border-style: solid; padding: 20px;">
are you sure submit the page?<br/>
<asp:ButtonID="btnOK"runat="server"Text="OK"/>
<asp:ButtonID="btnCancel"runat="server"Text="Cancel"/>
</asp:Panel>
</div>

Step3: Run the project

 Click on submit button 

AJAX Control Toolkit: ModalPopupExtender



Updated 04-Mar-2020

Leave Comment

Comments

Liked By