asp:Wizard NextButtonClick and UpdatePanel

Discussion in 'ASP .Net Web Controls' started by JeffDotNet, Sep 28, 2009.

  1. JeffDotNet

    JeffDotNet Guest

    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
    JeffDotNet, Sep 28, 2009
    #1
    1. Advertising

  2. 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.


    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:
    .

    ==================================================
    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.
    Allen Chen [MSFT], Sep 30, 2009
    #2
    1. Advertising

  3. 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.


    Can my code work?

    Regards,
    Allen Chen
    Microsoft Online Support
    Allen Chen [MSFT], Oct 2, 2009
    #3
    1. Advertising

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

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Bruno Alexandre

    GridView and NextButtonClick

    Bruno Alexandre, Jun 7, 2006, in forum: ASP .Net
    Replies:
    0
    Views:
    381
    Bruno Alexandre
    Jun 7, 2006
  2. Replies:
    3
    Views:
    479
    Rob Meade
    Aug 8, 2007
  3. Nathan Sokalski
    Replies:
    1
    Views:
    587
    miher
    Jun 15, 2009
  4. Bruno Alexandre

    GridView and NextButtonClick

    Bruno Alexandre, Jun 7, 2006, in forum: ASP .Net Datagrid Control
    Replies:
    2
    Views:
    165
    Bruno Alexandre
    Jun 9, 2006
  5. Ajit Goel

    Wizard Control and UpdatePanel

    Ajit Goel, Feb 23, 2008, in forum: ASP .Net Web Controls
    Replies:
    0
    Views:
    238
    Ajit Goel
    Feb 23, 2008
Loading...

Share This Page