Multiple UpdatePanels in Wizard with MasterPage does not work.

I've exhausted my resources on this and still haven't found an answer. I'm trying to use the UpdatePanel with a Wizard control who's page is using a MasterPage. If I use more then one UpdatePanel at a time I get a "javascript runtime error: Object Required" Here's what I have tried:

Using ScriptManagerProxy on the content page in addition to the ScriptManager that's in the MasterPage. Results = No effect.Stripping all javascript from both the MasterPage and The Content page. Results =No effectRemoving all comments. Results = No effect.Wrapping the entire Wizard in a UpdatePanel. Results = Not a good solution. My Wizard has 11 steps and at anytime during the steps if the user selects back on the browser it takes them completly out of the Wizard. Imagine how frustrating that would be in a Order process.Removed the page association to the Wizard. Results = Works but it's not a good solution as I lose the functionality of the MasterPage.When I use one UpdatePanel anywhere within the Wizards steps it works properly. It's only when I try to add a second Panel that I get the javascript error.Double checked my Atlas installation and files dates , sizes etc. Results = All files are correct.Searched the web for a possible solution. Results= Not a dam thing.Posted this message hereResults = TBD

I'm using VS 2005 and the March CPT release of Atlas.

hello.

this is problem related with the way the wizard control works. the problem is that the callback gets all the panels and the html only returns the visible one (so, if you have 3 panels, the wizard returns the one that is visible according with the current step, but due to the way that the callback mechanism works, you'll get all the other panels too and the client side of atlas will try to refresh those elements and this will trigger the error you're having).

to solve this, set the mode of all the updatepanels to condition. here's a demo page:

<%

@.PageLanguage="C#" %>

<!

DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<

scriptrunat="server">void P(object sender,EventArgs args)

{

if (sender == info1)

{

t1.Text = info1.Text;

}

elseif (sender == info2)

{

t2.Text = info2.Text;

}

else

t3.Text = info3.Text;

}

</

script>

<

htmlxmlns="http://www.w3.org/1999/xhtml">

<

headrunat="server"><title>Untitled Page</title>

</

head>

<

body><formid="form1"runat="server"><atlas:ScriptManagerrunat="server"ID="man"EnablePartialRendering="true"></atlas:ScriptManager><asp:Wizardrunat="server"ID="ma"><WizardSteps><asp:WizardStep><atlas:UpdatePanelrunat="server"ID="Pan1"Mode="Conditional"><ContentTemplate><asp:TextBoxrunat="server"ID="info1"OnTextChanged="P"AutoPostBack="true"/><br/><asp:Literalrunat="server"ID="t1"/></ContentTemplate></atlas:UpdatePanel></asp:WizardStep><asp:WizardStep><atlas:UpdatePanelrunat="server"ID="UpdatePanel1"Mode="Conditional"><ContentTemplate><asp:TextBoxrunat="server"ID="info2"OnTextChanged="P"AutoPostBack="true"/><br/><asp:Literalrunat="server"ID="t2"/></ContentTemplate></atlas:UpdatePanel></asp:WizardStep><asp:WizardStep><atlas:UpdatePanelrunat="server"ID="UpdatePanel2"Mode="Conditional"><ContentTemplate><asp:TextBoxrunat="server"ID="info3"OnTextChanged="P"AutoPostBack="true"/><br/><asp:Literalrunat="server"ID="t3"/></ContentTemplate></atlas:UpdatePanel></asp:WizardStep></WizardSteps></asp:Wizard></form><scripttype="text/javascript"src="Atlas.js"></script>

</

body>

</

html>

Hi Luis,

That worked beautifully, thank you very much! I remeber trying mode="Conditional" however I think I probably didn't set all the panels as I should have.

On a related note, I turned the step buttons into templates so I could have more freedom on placement. I'm also setting the ActiveStepIndex in the codebehind instead of using CommandName. If I wrap those buttons with the UpdatePanel they lose their ability to step, it's like they are ignoring the ActiveStepIndex or I get the JavaScript error. It would be nice to be able to include these step buttons in the UpdatePanel. On the credit card confirmation step it can take several seconds for a response and providing the progress indicator pretty much ensures the user will wait.

Is this also related to the way the wizard callback mechanisum works?

hello again.

hum...not sure on that...can you change the previous page i've posted so that it uses your templates for the step buttons? i'm a little busy now and if you'd change that page i'd be able to take 5 mins and try to understand what's going on...

Hi Luis,

I used your example and modified it to show you the behavior. I did put it in VB and pasted it below. If you will notice I have two rows of buttons. The first row are buttons inside the update panel. They set the active step in the code behind. The second set is the button templates for the wizard. Clicking the first row buttons just causes a post back. Although when you click the second row next button after clicking the first row next button the page jumps to step 3. So for some reason the index is changing but the actual step is not displaying. Also another strange behavior I observed with my existing project is when I uplaoded the new aspx files with the update panel to my isp's server, the page is actualy refreshing on updates where as it does not when I run it on my localHost. Not sure why this is occuring. I understand your busy and if you think I should repost the last issue in a new thread, I will. Just thought I would mention it here.

Thanks,

Jason

testnm.aspx:

<%

@.PageLanguage="VB"AutoEventWireup="false"CodeFile="testnm.aspx.vb"Inherits="testnm"title="Untitled Page" %>

<!

DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<

htmlxmlns="http://www.w3.org/1999/xhtml">

<

headrunat="server">

<

title>Untitled Page</title>

</

head>

<

body>

<

formid="form2"runat="server">

<

atlas:ScriptManagerrunat="server"ID="man"EnablePartialRendering="true">

</

atlas:ScriptManager>

<

asp:Wizardrunat="server"ID="ma"ActiveStepIndex="0">

<

WizardSteps>

<

asp:WizardSteprunat="server">

<

atlas:UpdatePanelrunat="server"ID="Pan1"Mode="Conditional">

<

ContentTemplate>

<

asp:TextBoxrunat="server"ID="info1"AutoPostBack="true"/>

<

br/>

<

asp:Literalrunat="server"ID="t1"/><br/><br/><asp:ButtonID="StartNextButton1"runat="server"Text="Next"/><br/>

</

ContentTemplate>

</

atlas:UpdatePanel>

</

asp:WizardStep>

<

asp:WizardSteprunat="server">

<

atlas:UpdatePanelrunat="server"ID="UpdatePanel1"Mode="Conditional">

<

ContentTemplate>

<

asp:TextBoxrunat="server"ID="info2"AutoPostBack="true"/>

<

br/>

<

asp:Literalrunat="server"ID="t2"/><br/><br/><asp:ButtonID="StepPreviousButton1"runat="server"CausesValidation="False"Text="Previous"OnClick="StepPreviousButton1_Click"/><asp:ButtonID="StepNextButton1"runat="server"Text="Next"/><br/>

</

ContentTemplate>

</

atlas:UpdatePanel>

</

asp:WizardStep>

<

asp:WizardSteprunat="server">

<

atlas:UpdatePanelrunat="server"ID="UpdatePanel2"Mode="Conditional">

<

ContentTemplate>

<

asp:TextBoxrunat="server"ID="info3"AutoPostBack="true"OnTextChanged="info3_TextChanged"/>

<

br/>

<

asp:Literalrunat="server"ID="t3"/><br/><br/><asp:ButtonID="FinishPreviousButton1"runat="server"CausesValidation="False"Text="Previous"OnClick="FinishPreviousButton1_Click"/><asp:ButtonID="FinishButton1"runat="server"CommandName="MoveComplete"Text="Finish"/><br/>

</

ContentTemplate>

</

atlas:UpdatePanel>

</

asp:WizardStep>

</

WizardSteps><StartNavigationTemplate><asp:ButtonID="StartNextButton"runat="server"CommandName="MoveNext"Text="Next"/></StartNavigationTemplate><StepNavigationTemplate><asp:ButtonID="StepPreviousButton"runat="server"CausesValidation="False"CommandName="MovePrevious"Text="Previous"/><asp:ButtonID="StepNextButton"runat="server"CommandName="MoveNext"Text="Next"/></StepNavigationTemplate><FinishNavigationTemplate><asp:ButtonID="FinishPreviousButton"runat="server"CausesValidation="False"CommandName="MovePrevious"Text="Previous"/><asp:ButtonID="FinishButton"runat="server"CommandName="MoveComplete"Text="Finish"/></FinishNavigationTemplate><NavigationStyleHorizontalAlign="Left"/>

</

asp:Wizard>

</

form>

<

scripttype="text/javascript"src="scriptlibrary\atlas\debug\Atlas.js"></script>

</

body>

</

html>

testnm.asxp.vb:

Partial

Class testnmInherits System.Web.UI.PageProtectedSub info1_TextChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles info1.TextChanged

t1.Text = info1.Text

EndSubProtectedSub info2_TextChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles info2.TextChanged

t2.Text = info2.Text

EndSubProtectedSub info3_TextChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles info3.TextChanged

t3.Text = info3.Text

EndSubProtectedSub StartNextButton1_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles StartNextButton1.Click

ma.ActiveStepIndex = 1

EndSubProtectedSub StepNextButton1_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles StepNextButton1.Click

ma.ActiveStepIndex = 2

EndSubProtectedSub StepPreviousButton1_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles StepPreviousButton1.Click

ma.ActiveStepIndex = 0

EndSubProtectedSub FinishPreviousButton1_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles FinishPreviousButton1.Click

ma.ActiveStepIndex = 1

EndSub

End

Class

hello.

though i just galnce at it, i'd say that this is the expected behavior. when a control placed inside the updatepanel generates a postback, the content of that panel is sent back to the client. so, the problem is that you're changing the updatepanel, but the scriptmanager is getting the content of the panel that caused the postback. i haven't seen if there's a workaround for this issue...

Hey Luis,

Its curious that it works if you wrap the entire wizard in the UpdatePanel. If I knew then what I know now, I wouldn't have used the Wizard.

Thanks for the help.

Jason