Search code examples
javascriptajaxmodalpopupextender

Trouble getting a reference to a ModalPopupExtender using javascript


I am trying to use the following code to get a reference to a modalpopupextender, but when I check the value of the javascript variable 'modal' it is always null. What is the proper way to get a reference to the AJAX control using javascript?

.vb

        Dim myStringBuilder As New StringBuilder(246)
        myStringBuilder.AppendFormat("      <script type=""text/javascript"">{0}", Environment.NewLine)
        myStringBuilder.AppendFormat("            var modal = $find('<%=modal1.ClientID%>');{0}", Environment.NewLine)
        myStringBuilder.AppendFormat("            debugger;{0}", Environment.NewLine)
        myStringBuilder.AppendFormat("            $find('<%=modal1.ClientID%>').add_showing({0}", Environment.NewLine)
        myStringBuilder.AppendFormat("                function(){0}", Environment.NewLine)
        myStringBuilder.AppendFormat("                {{{0}", Environment.NewLine)
        myStringBuilder.AppendFormat("                    alert(""Modal popup will be showing"");{0}", Environment.NewLine)
        myStringBuilder.AppendFormat("                }}{0}", Environment.NewLine)
        myStringBuilder.AppendFormat("            );{0}", Environment.NewLine)
        myStringBuilder.AppendFormat("      </script>{0}", Environment.NewLine)
        ClientScript.RegisterStartupScript(Me.GetType(), "myJSalert", myStringBuilder.ToString())

.aspx

        <ajaxToolkit:ModalPopupExtender ID="mpeResetConfirm" runat="server"
        TargetControlID="btnReset" PopupControlID="pnlConfirmation" BehaviorID="modal1"/> 

Solution

  • I suspected that part of the problem was the popupextenders had not been rendered at the time the script was being called. So after googling I found this post: http://forums.asp.net/p/1413275/3112082.aspx#3112082. Here is the solution I ended up with:

    .aspx

        <ajaxToolkit:ModalPopupExtender ID="mpeResetConfirm" runat="server"
        TargetControlID="btnReset" PopupControlID="pnlConfirmation" BehaviorID="modal1"/>
        <script type="text/javascript" language="javascript">
            function pageLoad() 
            {
                var modal = $find('modal1');
                debugger;
                $find('modal1').add_showing(
                    function()
                    {
                        alert("Modal popup will be showing");
                    }
               );  
            }
        </script>