AJAX ModalPopup triggered by dropdownlist

Question

If "delete" item in dropdownlist is selected i want to display a confirmation dialog via AJAX ModalPopup.

If OK button is clicked (inside the confirmation dialog) the delete method should be called.

Because ModalPopup's OnOkScript property requires a JavaScript method, there is obviously no direct way to call server side method.

What should I do?

Should I place the deleting method inside a hidden button, pass it's reference to a javascript function(the OnOkScript) and then call it via __doPostBack?

Is there a simpler way?

Answer 1

In your OnOkScript javascript method, do an AJAX POST to a server-side page to do the delete.

Answer 2

You do have the option to do everything requested via server side code.

Set your markup as something similar:

<asp:DropDownList
    AutoPostBack="true"
    OnSelectedIndexChanged="ConfirmDelete_SelectedIndexChanged"
    runat="server" />

<asp:LinkButton
    ID="btnNotInUse"
    runat="server" />

<asp:Panel
    ID="pnlPopup"
    style="display:none;"
    runat="server">
    This is your confirmation dialog.<br />
    <asp:Button ID="btnDelete" runat="server" />
</asp:Panel>

<ajaxToolkit:ModalPopupExtender
    ID="mpeModal"
    TargetControlID="btnNotInUse"
    PopupControlID="pnlPopup"
    runat="server" />

Now, when your DropDownList changes, you'll fire the server event "ConfirmDelete_SelectedIndexChanged", which looks like the following:

protected void ConfirmDelete_SelectedIndexChanged(object sender, EventArgs e)
{
    if(/*some logic that states if "delete" is selected*/)
     mpeModal.Show();
}

In effect, when you change a selection in the drop down, the server checks to see if "Delete" was selected. If so, your modal popup is now shown with an a button that actually can delete from your datasource or do whatever you need to accomplish.

Answer 3

Using this way, Modal popu is opening just like the simple panel not in popup form. Please guide Alexis how can do to open in popup form.