How can I prevent a page to jump to top position after failed validation?

时光怂恿深爱的人放手 提交于 2019-11-28 04:10:33

I've asked the question on asp.net (http://forums.asp.net/p/1545969/3779312.aspx) and got replies with two solutions. The better one is this piece of Javascript which maintains the scroll position:

<script type="text/javascript">
    window.scrollTo = function( x,y ) 
    {
        return true;
    }
</script>

This is only to put on the page and nowhere to call.

The other solution is similar to RioTera's proposal here (using MaintainScrollPositionOnPostBack) but adds EnableClientScript="false" to the Validators to force a postback. It works too, but the price is an artificial postback.

You can use the the Page property MaintainScrollPositionOnPostBack :

In the code-behind:

Page.MaintainScrollPositionOnPostBack = true;

or in your webform:

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" MaintainScrollPositionOnPostback="true" %>

Try setting the page focus Page.SetFocus(control); I have an insert button which adds an extra row to my gridview, which is one of many items on a page so I can add Page.SetFocus(control) as the last method in my btnInsert_Click event.

Freddie

I've found that setting the property:

maintainScrollPositionOnPostBack="true"

in your Web.config <pages> section works well.

The page flickers because the whole page is posted back to the server and the content is sent back from server again. You need to use UpdatePanel tag to surround the place you want to refresh. It will only postback the information which is inside the tag

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
    <!-- Place updatable markup and controls here. -->
</ContentTemplate>
</asp:UpdatePanel>

Read http://msdn.microsoft.com/en-us/library/bb386573(v=vs.100).aspx#CodeExamples

Darkseal

Unfortunately MantainScrollPositionOnPostback doesn't work anymore on modern browsers. For a cross-browser-compatible solution you can use this snippet (requires jQuery):

<asp:HiddenField runat="server" ID="hfPosition" Value="" />
<script type="text/javascript">
    $(function () {
        var f = $("#<%=hfPosition.ClientID%>");
        window.onload = function () {
            var position = parseInt(f.val());
            if (!isNaN(position)) {
                $(window).scrollTop(position);
            }
        };
        window.onscroll = function () {
            var position = $(window).scrollTop();
            f.val(position);
        };
    });
</script>

See also my answer here.

I'm using MVC5 and the only way to stop the jump was with the JQuery code below.

I've tested the solution on Safari, Chrome, Mozilla, Internet Explorer and Opera.

$(document).scrollTop($('form#formCheckout').offset().top);
    event.stopPropagation();
    event.preventDefault();
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!