Stop postback closing a ModalPopupExtender Panel


Sunday 10 May 2009

Stop postback closing a ModalPopupExtender Panel
If you are experiencing problems with the postback actions of buttons closing a ModalPopupExtenter Panel, the resolution is really quite simple.

All you have to do is make sure you put the Update Panel within the Panel being used for you ModelPopupExtender Panel an example of this is below:
  1. <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="LinkButton1" PopupControlID="pnlImg" BackgroundCssClass="popupbackground" okcontrolid="CancelButton" cancelcontrolid="CancelButton">  
  2. </cc1:ModalPopupExtender>  
  3.   
  4. <asp:Panel ID="pnlImg" runat="server" CssClass="popuppanel">  
  5. <asp:updatepanel ID="UpdatePanel1" runat="server">  
  6. <ContentTemplate>  
  7.     <div id="popup">  
  8.         <h1><asp:Label ID="lblTitle2" runat="server" /></h1>  
  9.         <br /><br />  
  10.         <asp:image id="img2" runat="server" cssclass="noborder" /><asp:textbox id="txtImageID2" runat="server" visible="false" />  
  11.         <br /><br />  
  12.         <table cellpadding="0" cellspacing="0" class="popuptable">  
  13.             <tr>  
  14.             <td class="popuptableleft">  
  15.                 <asp:LinkButton ID="btnPrev" runat="server" Text="Previous" onclick="btnPrev_Click" />  
  16.             </td>  
  17.             <td class="popuptablemiddle">  
  18.                 <asp:LinkButton ID="CancelButton" runat="server" Text="Close" onclick="CancelButton_Click" />  
  19.             </td>  
  20.             <td class="popuptableright">  
  21.                 <asp:LinkButton ID="btnNext" runat="server" Text="Next" onclick="btnNext_Click" />  
  22.             </td>  
  23.             </tr>  
  24.         </table>  
  25.     </div>  
  26. </ContentTemplate>  
  27. </asp:updatepanel>  
  28. </asp:Panel>  
So as you can see from the above, just moving that UpdatePanel inside the Panel is all you need to do. One thing to remember though, is that if you have used more AJAX features on your page, you will need to add more update panels and ensure the AJAX elements are within them.


32 people like this article, click here to say you like this article too (32)
Send a link to this page via email Send a link to this page
 


Latest Technical Articles




Valid XHTML | Valid CSS

Wallace IT, Web Design & IT Services© Copyright 2004-2010. Wallace IT. All Rights Reserved.

Wallace IT