views:

150

answers:

2

Hi,

I am using an update panel for a form that when continue button is clicked returns to the same page but makes visible different fields to be filled in. One of the fields is some credit card data and is part of a user control. The user control has a "Pay Now" button. So, inside the page there is a user control containing fields that you fill in and then click "Pay Now". After hitting this button, if there's a validation error, error shows at the top of the page but the page doesn't move to top of page. I would like to know how after the user clicks on the user control button that is on a page that is wrapped in update panel can I scroll to the top of the page.(javascript not jquery would be preferable in this instance)

Code samples:

<ajax:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
       <asp:ImageButton ID="ContinueButton" runat="server" AlternateText="Continue"  SkinID="Continue" EnableViewState="false" OnClick="ContinueButton_Click" ValidationGroup="group1" />
</ContentTemplate>
</ajax:UpdatePanel>

In Code behind a user control is instantiated.

ASP.CreditCardStuff cc = new ASP.CreditCardStuff();
                cc.ValidationGroup = "group1";
                phForms.Controls.Add(cc);

This is the user control that contains the "Pay Now" button

A: 

How about providing a validation error indicator next to the button as well as at the top of the page? This way the page would remain scrolled to the same point (nicer for the user), rather than jumping to the top, purely to make the error indicator at the top of the page visible (not so nice).

AdamRalph
A: 

You could handle the end_request event:

function pageLoad(sender, args) {
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(function (sender, args) {
        if (args.get_error() == null) {
            // do the scrolling here
        }
    });
}
Darin Dimitrov