troubleshooting Question

2 AJAX ModalPopupExtender pointing to single PopupControlID not working. ?

Avatar of sqdperu
sqdperuFlag for United States of America asked on
ASP.NETVisual Basic.NETAJAX
4 Comments1 Solution49 ViewsLast Modified:
ASP.NET / VB.NET 2017 webform / AJAX toolkit

I have a panel that needs to display when either of 2 SVG circles are clicked.  I don't want to have the exact same code twice with the only difference being the Panel ID.  So I have 2 ModalPopupExtenders with a different TargetControlID on each (circle), but both pointing to the same PopupControlID.

The code is below.   If I comment out either one of the <ajaxToolkit:ModalPopupExtender /> code sections, the other one works just fine.   But when both code sections are active, clicking on either TargetControlID circle results in the web page darkening (normal) and the modal popup never appears.

What am I doing wrong?

Thanks,

        <ajaxToolkit:ModalPopupExtender 
                ID="mpeMfgPopupStart" 
                runat="server"            
                TargetControlID="circle5"
                PopupControlID="panMfgPopup"
                BackgroundCssClass="modalBackground"
                DropShadow="True"
                CancelControlID="btnMfgClose">
        </ajaxToolkit:ModalPopupExtender>


        <%-- I need 2 TargetControlID that execute the same Popup.  Just copy one and change the ID and TargetControlID --%>
        <ajaxToolkit:ModalPopupExtender 
                ID="mpeMfgPopupComplete" 
                runat="server"            
                TargetControlID="circle6"
                PopupControlID="panMfgPopup"
                BackgroundCssClass="modalBackground"
                DropShadow="True"
                CancelControlID="btnMfgClose">
        </ajaxToolkit:ModalPopupExtender>

        <asp:Panel ID="panMfgPopup" runat="server" CssClass="modalPopupMfg" style="display:none; background-color: #F7F7F7"> 

            <asp:UpdatePanel ID="UpdatePanelMfg" runat="server">
              <ContentTemplate> 

                <div class="header">
                    <asp:Label ID="lblMfgTitle" runat="server" Text="MANUFACTURING"></asp:Label>
                </div>
                <div class="body">
                    <table id="Manufacturing" width="100%" border="0" cellpadding="10" cellspacing="0" class="tbl_order_header">


                           The content code...


                    </table>
                </div>
              </ContentTemplate>
            </asp:UpdatePanel> 

            <hr style="border-top: 1px solid #EDEDED; background: transparent; width:690px"/>

            <div class="footer" align="right">

                <asp:Button ID="btnMfgClose" runat="server" Text="X" OnClick = "MfgClose_Click" Width="100px" Height="24px" BackColor="#EDEDED" ForeColor="#333333" Font-Bold="True" Visible="True" />
            </div>
            
            <ajaxToolkit:DragPanelExtender ID="DragPanelExtenderMfg" runat="server" TargetControlID="panMfgPopup" />

        </asp:Panel>
Join the community to see this answer!
Join our exclusive community to see this answer & millions of others.
Unlock 1 Answer and 4 Comments.
Join the Community
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 4 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros