2

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!

Jim G.
  • 15,141
  • 22
  • 103
  • 166
VansFannel
  • 45,055
  • 107
  • 359
  • 626

3 Answers3

9

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.

Luke Girvin
  • 13,221
  • 9
  • 64
  • 84
Tim Scarborough
  • 1,270
  • 1
  • 11
  • 22
  • How would this work with GridView TemplateField containing a LinkButton that is to display the modal on click? I have rows of data that I want to 'Edit' the details of when clicking the LinkButton on that row. – Mark Richman Jul 16 '10 at 00:53
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;
}
David Glenn
  • 24,412
  • 19
  • 74
  • 94
  • Yes, it's a great solution but when it shows the modal popup it doesn't go to server. – VansFannel May 22 '09 at 09:35
  • @David Glenn It doesn't work if all the things are in inside update panel.. It doesn't trigger any postback and even if you enable the autopost back of dropdown to true then it hides the popup. – Irfan Raza Mar 13 '16 at 22:44
1

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.

Community
  • 1
  • 1
VansFannel
  • 45,055
  • 107
  • 359
  • 626