Page 1 of 1

C# AJAX Modal Popup - Disable & Enable AJAX Modal Popup C#

#1 smcherniss  Icon User is offline

  • New D.I.C Head
  • member icon

Reputation: 7
  • View blog
  • Posts: 8
  • Joined: 25-June 08

Posted 07 June 2010 - 09:01 AM

I recently came across a situation where I needed to disable the AJAX Modal Popup Extender. When I set the enabled property to false, it would no longer hide the panel that the extender displays when the Target Control is clicked. I could not set the panel's visible property to false because it existed outside of the AJAX Update Panel. When a control exists outside of the AJAX update panel it does not change after an Asynchronous Post Back.
I resolved the issue by adding a placeholder control to the aspx file (design mode). Make sure it is contained within the AJAX update panel. Then when you need to enable the Modal Popup Extender, you can dynamically add modalpopupextender to placeholder during an Asynchronous Post Back Event. Then I would dynamically add the AJAX Modal Popup during the Asynchronous Post Back Event.


<asp:panel 
	id="pnlSTARRetractionLoanDetails" 
	runat="server" 
	height="430px" 
	width="850px" 
	cssclass="collapsePanel" />
<asp:updatepanel 
	id="upnlSTARRetractionLoanDetails" 
	runat="server" 
	updatemode="Conditional" 
	ChildrenAsTriggers="false" />
	
	<ContentTemplate>
   
   <!-- The Placeholder will contain the AJAX Modal Popup -->
	<asp:placeholder id="phModalPopups" runat="server"> </asp:placeholder>






(Make sure this is during AsyncPostBack and dont forget to update the AJAX Update Panel)


	// Instantiate the AJAX Modal Popup Object
	AjaxControlToolkit.ModalPopupExtender pnlpopSTARRetractionRequestorDepartmentAddition;	
	pnlpopSTARRetractionRequestorDepartmentAddition = new AjaxControlToolkit.ModalPopupExtender();
	
	// Initialize the Modal Popup Properties
	pnlpopSTARRetractionRequestorDepartmentAddition.ID = "pnlpopSTARRetractionRequestorDepartmentAddition";
	pnlpopSTARRetractionRequestorDepartmentAddition.TargetControlID = "imgSTARRetractionRequestorDepartmentAddition";
	pnlpopSTARRetractionRequestorDepartmentAddition.PopupControlID = "pnlSTARRetractionRequestorDepartmentAddition";
	pnlpopSTARRetractionRequestorDepartmentAddition.BackgroundCssClass = "modalBackground";
	pnlpopSTARRetractionRequestorDepartmentAddition.DropShadow = true;
	pnlpopSTARRetractionRequestorDepartmentAddition.OkControlID = "btnSTARRetractionRequestorDepartmentAddition";
	pnlpopSTARRetractionRequestorDepartmentAddition.OnOkScript = "insertNewSTARRequestorDepartment()";
	pnlpopSTARRetractionRequestorDepartmentAddition.CancelControlID = "btnSTARRetractionRequestorDepartmentCancel";
	
	// Add the popup to the PlaceHolder we positioned in the AXPX Form	
	phModalPopups.Controls.Add( pnlpopSTARRetractionRequestorDepartmentAddition );

	// Update the AJAX Update Panel to display the Modal Popup
	upnlSTARRetractionLoanDetails.update();
		
	



When the Modal Popup is added during an Asynchronous Post Back, you have to dynamically add during every post back you want the Modal Popup to be enabled.
I hope this helps out. I personally tried several different ways to disable the ModalPopupExtender and this ended up being the solution I used.

smcherniss

Is This A Good Question/Topic? 0
  • +

Replies To: C# AJAX Modal Popup - Disable & Enable

#2 Frinavale  Icon User is offline

  • D.I.C Addict
  • member icon

Reputation: 203
  • View blog
  • Posts: 776
  • Joined: 03-June 10

Posted 25 June 2010 - 01:03 PM

View Postsmcherniss, on 07 June 2010 - 08:01 AM, said:

I could not set the panel's visible property to false because it existed outside of the AJAX Update Panel. When a control exists outside of the AJAX update panel it does not change after an Asynchronous Post Back.


This is true for all ASP.NET controls, not just the Modal Popup extender.

If any control is outside of an UpdatePanel, you cannot change it when the UpdatePanel performs an asynchronous postback to the server.

I think that this concept is hard for a first time user of Ajax/UpdatePanels in ASP.NET because of the way it's implemented... In a classic Ajax request you would send only what is needed to the server for it to execute and return with some HTML; however, in ASP.NET web forms the entire page is sent to the server asynchronously so that the ASP.NET page life cycle can take place. When the response is being sent to the browser, it is stripped down to only contain the HTML for the controls within the UpdatePanel.

This means that during asynchronous requests to the server you will have access to all of the page's controls in your VB or C# servers-side code; however, that does not mean that these controls will be refreshed when the response is sent to the browser...any controls that exist outside of the UpdatePanel cannot be changed during the UpdatePanel's asynchronous postback to the server.

-Frinny

Just a quick question...why didn't you just set visibility to false (either using the Panel.Visible property or using CSS display:none) for the Panel that the Modal Popup Extender was attached to when the Modal Popup Extender was disabled?

-Frinny
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1