asp:Wizard NextButtonClick and UpdatePanel

J

JeffDotNet

I have a wizard that has a long running step (3-4 seconds) and I would like
to show a progress bar on the NextButtonClick of the Wizard. I am able to
get the trigger to work with a button and its click event. However when I
attempt to use the NextButtonClick of the wizard the UpdateProgress appears
as expected but the Wizard is no longer able to advance to the next step. I
have also noticed that when the Wizards NextButtonClick is occurs a second
time a dialog pops up stating there has been and ‘Invalid postback or
callback argument. Adding RegisterForEventValidation does not clear the
error.

Protected Overrides Sub Render(ByVal writer As System.Web.UI.HtmlTextWriter)

Page.ClientScript.RegisterForEventValidation("Wizard1")
MyBase.Render(writer)
End Sub



I have attached a simple wizard example that shows the problem I'm having.

If someone could let me know what I’m doing wrong it would be most appreciated

Jeff


<%@ Page Language="VB" AutoEventWireup="false"
CodeFile="SimpleWizard.aspx.vb" Inherits="SimpleWizard" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Simple Wizard with UpdatePanel</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

<script language="javascript" type="text/jscript">

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);

var postBackElement;

function InitializeRequest(sender, args){

if (prm.get_isInAsyncPostBack())
{args.set_cancel(true);
}

postBackElement = args.get_postBackElement();

if (
(postBackElement.id == 'Button1')
|| (postBackElement.id ==
'Wizard1_StartNavigationTemplateContainerID_StartNextButton')
)
{$get('UpdateProgress1').style.display = 'block';}
}

function EndRequest(sender, args){
if (

(postBackElement.id == 'Button1')
|| (postBackElement.id ==
'Wizard1_StartNavigationTemplateContainerID_StartNextButton')
)
{$get('UpdateProgress1').style.display = 'none';}
}
</script>

</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1"
EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="Wizard1"
EventName="NextButtonClick" />

</Triggers>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1"
AssociatedUpdatePanelID="UpdatePanel1" runat="server">
<ProgressTemplate>
<br />
UpdateProgress is working
<table style="vertical-align: middle;">
<tr style="vertical-align: top">
<td>
<img src="images/indicator.gif" height="16"
width="16" />
</td>
<td style="color: Gray">
Now Processing...
</td>
</tr>
</table>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:Button ID="Button1" runat="server" Text="Test UpdatePanel
alone" OnClick="Button1_Click" />
<br />
<div style="border: solid 1pk black;">
<asp:Wizard ID="Wizard1" runat="server" DisplaySideBar="false">
<StartNavigationTemplate>
<div>
<asp:Button ID="StartCancelButton" runat="server"
BackColor="#FFFBFF" BorderColor="#CCCCCC"
BorderStyle="Solid" BorderWidth="1px"
CommandName="Cancel" Font-Names="Verdana"
Font-Size="0.8em" ForeColor="#284775" Text="Cancel"
AccessKey="c" CssClass="cancelButton"
CausesValidation="false" ToolTip="Alt+c"
Style="position: relative; left: -495px;
bottom: 5px;" />
<asp:Button ID="StartNextButton" runat="server"
BackColor="#FFFBFF" BorderColor="#CCCCCC"
BorderStyle="Solid" BorderWidth="1px"
CommandName="MoveNext" Font-Names="Verdana"
Font-Size="0.8em" ForeColor="#284775" Text="Next"
AccessKey="n" Style="position: relative; bottom:
5px; right: 10px;" />
</div>
</StartNavigationTemplate>
<WizardSteps>
<asp:WizardStep runat="server" Title="Step 1">
<div style="width: 500px; height: 200px; border:
solid 1pk black; background-color:Bisque">
<ul>
<li>Click the <span style="
font-style:italic">Test UpdateProgress alone</span> to verify the
UpdateProgress works without involving the wizard</li>
<li>Click the <span style="
font-style:italic">Next</span> button on the wizard to trigger the
UpdatePanel</li>
</ul>
<br />
Unfortunetly attempting to trigger from the
Wizard1 NextButtonClick event causes the UpdatePanel to jump but not display
the progress panel and does not allow the Wizard to advance to the next step.
</div>
</asp:WizardStep>
<asp:WizardStep runat="server" Title="Step 2">
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
</div>
</div>
</form>
</body>
</html>

!--- CodeBehind --

Option Strict On
Option Explicit On

Partial Class SimpleWizard
Inherits System.Web.UI.Page

Public Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs)
System.Threading.Thread.Sleep(2000)
End Sub


Public Sub Wizard1_NextButtonClick(ByVal sender As Object, ByVal e As
WizardNavigationEventArgs) Handles Wizard1.NextButtonClick
System.Threading.Thread.Sleep(2000)
End Sub

Protected Overrides Sub Render(ByVal writer As
System.Web.UI.HtmlTextWriter)
Page.ClientScript.RegisterForEventValidation("Wizard1")
MyBase.Render(writer)
End Sub

End Class
 
A

Allen Chen [MSFT]

Hi,
I have a wizard that has a long running step (3-4 seconds) and I would like
to show a progress bar on the NextButtonClick of the Wizard. I am able to
get the trigger to work with a button and its click event. However when I
attempt to use the NextButtonClick of the wizard the UpdateProgress appears
as expected but the Wizard is no longer able to advance to the next step. I
have also noticed that when the Wizards NextButtonClick is occurs a second
time a dialog pops up stating there has been and ‘Invalid postback or
callback argument. Adding RegisterForEventValidation does not clear the
error.
Click to expand...

If you want to update the Wizard control on async postback please put it in
the ContentTemplate of UpdatePanel. Below is the updated code that works on
my side. Please test it to see if it's what you need:

<asp:Button ID="Button1" runat="server" Text="Test
UpdatePanel
alone" OnClick="Button1_Click" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1"
EventName="Click" />


</Triggers>
<ContentTemplate>
<div style="border: solid 1pk black;">
<asp:Wizard ID="Wizard1" runat="server"
DisplaySideBar="false">
<StartNavigationTemplate>
<div>
<asp:Button ID="StartCancelButton" runat="server"
BackColor="#FFFBFF" BorderColor="#CCCCCC"
BorderStyle="Solid" BorderWidth="1px"
CommandName="Cancel" Font-Names="Verdana"
Font-Size="0.8em" ForeColor="#284775" Text="Cancel"
AccessKey="c" CssClass="cancelButton"
CausesValidation="false" ToolTip="Alt+c"
Style="position: relative; left: -495px;
bottom: 5px;" />
<asp:Button ID="StartNextButton" runat="server"
BackColor="#FFFBFF" BorderColor="#CCCCCC"
BorderStyle="Solid" BorderWidth="1px"
CommandName="MoveNext" Font-Names="Verdana"
Font-Size="0.8em" ForeColor="#284775" Text="Next"
AccessKey="n" Style="position: relative; bottom:
5px; right: 10px;" />
</div>
</StartNavigationTemplate>
<WizardSteps>
<asp:WizardStep ID="WizardStep1" runat="server"
Title="Step 1">
<div style="width: 500px; height: 200px; border:
solid 1pk black; background-color:Bisque">
<ul>
<li>Click the <span style="
font-style:italic">Test UpdateProgress alone</span> to verify the
UpdateProgress works without involving the wizard</li>
<li>Click the <span style="
font-style:italic">Next</span> button on the wizard to trigger the
UpdatePanel</li>
</ul>
<br />
Unfortunetly attempting to trigger from the
Wizard1 NextButtonClick event causes the UpdatePanel to jump but not
display
the progress panel and does not allow the Wizard to advance to the next
step.
</div>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep2" runat="server"
Title="Step 2">
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
</div></ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1"
AssociatedUpdatePanelID="UpdatePanel1" runat="server">
<ProgressTemplate>
<br />
UpdateProgress is working
<table style="vertical-align: middle;">
<tr style="vertical-align: top">
<td>
<img src="images/indicator.gif" height="16"
width="16" />
</td>
<td style="color: Gray">
Now Processing...
</td>
</tr>
</table>
</ProgressTemplate>
</asp:UpdateProgress>

If you have additional questions please don't hesitate to let me know. I'll
do my best to follow up.

Regards,
Allen Chen
Microsoft Online Support

Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we can improve the support we provide to you. Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
(e-mail address removed).

==================================================
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/en-us/subscriptions/aa948868.aspx#notifications.

Note: MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response from the community or a Microsoft Support
Engineer within 2 business day is acceptable. Please note that each follow
up response may take approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution. The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions. Issues of this
nature are best handled working with a dedicated Microsoft Support Engineer
by contacting Microsoft Customer Support Services (CSS) at
http://msdn.microsoft.com/en-us/subscriptions/aa948874.aspx
==================================================
This posting is provided "AS IS" with no warranties, and confers no rights.
 
A

Allen Chen [MSFT]

Hi,
I have a wizard that has a long running step (3-4 seconds) and I would like
to show a progress bar on the NextButtonClick of the Wizard. I am able to
get the trigger to work with a button and its click event. However when I
attempt to use the NextButtonClick of the wizard the UpdateProgress appears
as expected but the Wizard is no longer able to advance to the next step. I
have also noticed that when the Wizards NextButtonClick is occurs a second
time a dialog pops up stating there has been and ‘Invalid postback or
callback argument. Adding RegisterForEventValidation does not clear the
error.
Click to expand...

Can my code work?

Regards,
Allen Chen
Microsoft Online Support
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Wizard Next Button Error 0
NullReferenceException Error - Wizard Template 2
Index.php with bootstrap implementation and extern sites inclusion 0
UpdatePanel Question 1
UpdatePanel for image 0
asp:Wizard inside of a asp:FormView breaks two-way databinding 2
UpdatePanel is doing full postback when it should not 2
I need help fixing my website 2

Members online

No members online now.
Total: 57 (members: 0, guests: 57)
Robots: 365

Forum statistics

Threads
473,994
Messages
2,570,223
Members
46,812
Latest member
GracielaWa

Latest Threads

Top