Skip to content

asp modal popup closes immediately when running it from user control

I have a user control that contains a confirm button extender and a modal popup extender. It looks like:

<asp:Panel ID="panelConfirmBox" runat="server" Style="display:none;">

    <asp:Button ID="btnConfirmSelection" runat="server" CssClass="hidden"/>

    <asp:Button ID="btnNo" runat="server" Text="No" />
    <asp:Button ID="btnYes" runat="server" Text="Yes" />
              
<asp:ModalPopupExtender Id="popupConfirmBox" runat="server" PopupControlID="panelConfirmBox"  CancelControlID="btnNo" OkControlId="btnYes"  />
<asp:ConfirmButtonExtender ID="btnConfirm" runat="server" DisplayModalPopupID="popupConfirmBox"/> 

</asp:Panel>   

The user control gets a dropdownlist. When changing the dropdownlist selection, the button onclick event should run. In the user control aspx.cs there is the follow code:

public string TargetControlId { set { popupConfirmBox.TargetControlID = btnConfirm.TargetControlID = btnConfirmSelection.ID; } }
public DropDownList DDL { get; set; }
public EventHandler OnClick { set { btnConfirmSelection.Click += value; } get { return OnClick; } }


protected void Page_Load(object sender, EventArgs e)
{            
       if (DDL != null)
       {
               string script = "$('#" + DDL.ClientID + "').on('change', function () { $('#" + btnConfirmSelection.ClientID + "').click();}); ";
               ScriptManager.RegisterStartupScript(Page, Page.GetType(), "CallChange" + ID, script, true);                 
       }
}

Use the user control in aspx looks like:

<asp:DropDownList ID="ddl" runat="server" AutoPostBack="true"  />
<aa:DDLConfirmPopup runat="server" ID="ConfirmPopupSelectionChange" Title="aaa" Message="bbb" TargetControlId=""/>

and in aspx.cs:

ConfirmPopupSelectionChange.DDL = ddl;
ConfirmPopupSelectionChange.OnClick = new EventHandler(func);

protected void func(object sender, EventArgs e)
{
}

This is working fine, almost… The problem is that when changing the dropdownlist selection, the popup modal extender opens, but closes immediately. What can be the issue?

Thanks!

Answer

When selected item changes, your javascript code is trying to click on btnConfirmSelection button. The problem is, you have AutoPostBack="true". So it is posting back the page at the same time. For that reason it looks like the modal is closing down as you get the page again from server.

I haven’t tested your code but I’d suggest to set AutoPostBack="false" and check if that fixes the problem.

<asp:DropDownList ID="ddl" runat="server" AutoPostBack="false"  />