ASP.NET AJAX Control Toolkit: Show a ModalPopup and then do PostBack

Question

I want to show a modal popup when a user click on an asp button. The user must select an option of a panel. The value of the option selected must be saved to an input hidden and then the asp.net button must do a PostBack .

Can I do that?

Thank you!

Answer 1

It is possible for a ModalPopupExtender to be displayed using a postback. You'll need an invisible target control. The extender is attached to this hidden control.

<asp:Button runat="server" ID="btnShowModal" Text="Show" 
     OnClick="btnShowModal_Click" /> 
<asp:Button runat="server" ID="HiddenForModal" style="display: none" />
<ajaxToolKit:ModalPopupExtender ID="Modal1" runat="server" 
     TargetControlID="HiddenForModal" PopupControlID="PopupPanel" />

In your message handler in code-behind, you'll show the ModalPopupExtender:

Modal1.Show();

And in the code you're using to dismiss the Modal, call the ModalPopupExtender's Hide function:

Modal1.Hide();

I use this method for showing a modal that displays detailed data that I retrieve from a database based on what's selected in a GridView.

Answer 2

Add your Button or LinkButton

<asp:Button ID="MyButton" Text="Click Here" runat="server" />

Add a Panel to hold your options with a DropDownList

<asp:Panel ID="MyPanel" runat="server">
  <asp:DropDownList ID="MyDropDown" runat="server">
    <asp:ListItem Value="1" Text="Option 1" />
  </asp:DropDownList>
  <asp:Button ID="SaveBtn" Text="Save" OnClick="Save_Click" runat="server" />
  <asp:Button ID="CancelBtn" Text="Cancel" runat="server" />
</asp:Panel>

Add your ModelPopupExtender

<act:ModalPopupExtender ID="Mpe1" TargetControlID="MyButton"  
    CancelControlID="CancelBtn" PopupControlID="MyPanel" runat="server" />

Then add your code behind to the SaveBtn Button

public void SaveBtn_Click(object sender, EventArgs e) {
  string selectedOption = MyDropDown.SelectedValue;
} 

Answer 3

Finally, I've decided to use jQuery to show a ModalPopUp. The following question has the answer to this question:

jQuery UI's Dialog doesn't work on ASP.NET

If you are not agree, tell me.