Sunday, April 17, 2011

Why does ModalPopupExtender not show through javascript?

I followed several web resources to understand how to show a popup from client side, and I made this code:

<asp:ImageButton runat="server" ID="btnOk" ImageUrl="imagens/btnAlterar.gif" OnClientClick="btnOkClick()" />

<asp:LinkButton runat="server" ID="dummyForPopup" Visible="false"/>

<ajaxToolKit:ModalPopupExtender runat="server" BehaviorID="btnOkPopupBehavior" ID="MPXtender" TargetControlID="dummyForPopup"  PopupControlID="pnlUpdateUserModal" BackgroundCssClass="modalBackground" OkControlID="btnCloseRequestUserUpdate" OnOkScript="userUpdReq_onOk()" />


function btnOkClick()
{
    if(validateAll())
    {
     var behavior = $find('btnOkPopupBehavior');
     if (behavior)
     {
      behavior.show();
     }
     else
     {
      var lblOutput = $get('<%= lblOutput .ClientID %>');
      lblOutput .innerText = 'Couldn't find popup';
     }
    }
}

previously I had the modal popup linked to the ok button, it was working pretty well. Now I need some validation before opening the popup, and this code is not working anylonger =/

From stackoverflow
  • 1) Your dummy button has to be visible = true, otherwise the javascript doesn't work properly. So set visible = true but disaply none with css:

     <asp:LinkButton runat="server"
     ID="dummyForPopup" style
     ="display:none" Visible="true" />
    

    2) lblOutput .innerText = 'Couldn't find popup'; is a javascript error. You need to change it to: "Couldn't find popup"; (or use ')

    3) OnClientClick="btnOkClick()" should really say: OnClientClick="btnOkClick(); return false;"

    4) Look for any other javascript errors on your page because those will stop the popup from workign properly.

    Victor Rodrigues : Thanks, aquinas, it worked! ;)

0 comments:

Post a Comment

Note: Only a member of this blog may post a comment.