Search code examples
c#asp.netajaxajaxcontroltoolkitmodalpopupextender

Modal pop up inside a update panel not responding


<asp:ModalPopupExtender ID="MPE_EditGroup" runat="server" TargetControlID="btnShowPopup"
                    PopupControlID="pnlpopup" DropShadow="true" BackgroundCssClass="modalBackground" />   
 <asp:Panel ID="pnlpopup" runat="server" > 
 <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
                            <ContentTemplate>
                                <table width="100%" style="border: Solid 3px #980000; width: 470px; height: 370px;"
                                    cellpadding="0" cellspacing="0">
                                                                   <tr>
                                        <td align="center">

                                            <asp:ListBox ID="lst_allmembers" SelectionMode="Multiple" Width="120px" ToolTip="Press ctrl to select multiple users"
                                                DataValueField="FirstName" runat="server"></asp:ListBox>
                                            <asp:Button ID="btn_Add" runat="server" Text="Add User" OnClick="btn_Add_Click" />
                                        </td>
                                        <td align="center">

                                            <asp:ListBox ID="lst_grpmembers" DataValueField="Name" SelectionMode="Multiple" Width="120px"
                                                ToolTip="Press ctrl to select multiple users" runat="server"></asp:ListBox>
                                            <asp:Button ID="btn_remove" runat="server" Text="Remove User" OnClick="btn_Remove_Click" />
                                        </td>
                                    </tr>
                                  <tr><td></td><td></td></tr>
                                    <tr>
                                        <td align="right">
                                            <asp:Button ID="btnUpdate" CommandName="Update" runat="server" Text="Update" OnClick="btnUpdate_Click" />
                                        </td>
                                        <td align="left">
                                            <asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClick="Cancel_Click" />
                                        </td>
                                    </tr>
                                </table>
                            </ContentTemplate>

                            <Triggers>
                                <asp:AsyncPostBackTrigger ControlID="btn_Add" EventName="Click" />
                                <asp:AsyncPostBackTrigger ControlID="btn_remove" EventName="Click" />
                               </Triggers>
                              </asp:UpdatePanel><asp:Panel>

I have this table inside the update panel, and the add and remove works fine, but the update button doesnt respond, but the code is executed and everything is fine. but it has to close the modal pop up and display a alert, but it is not happening. If i do redirect when I click the update button it works. but I want to show a alert and then bind the table. what should be done

Code behind for update

 Page.ClientScript.RegisterStartupScript(GetType(), "UserDialogScript", "alert(\"Group successfully updated\");", true);
        BindGridView(Session["useremail"].ToString());

Solution

  • You might have missed something when copying it, but the ModalPopupExtender isn't closed properly:

    <asp:ModalPopupExtender ID="MPE_EditGroup" runat="server" 
        TargetControlID="btnShowPopup" 
        PopupControlID="pnlpopup" 
        DropShadow="true" 
        BackgroundCssClass="modalBackground" /> 
    

    As for closing the Popup and displaying an alert when the update button is clicked, try using a PostBackTrigger for the update button.

    <asp:PostBackTrigger ControlID="btnUpdate" EventName="Click" />  
    

    This will make the button perform a full postback, which will close the popup, and allow you to show the alert when the page reloads.