如何防止页面在验证失败后跳转到顶部位置？

我有一个简单的aspx页面，有几个文本框和一个提交按钮。一些字段是必需的，在按钮下面是一个ValidationSummary。完整的表格比屏幕高度大，因此必须向下滚动才能到达提交按钮。如果我没有填写所有必填字段，并按提交验证按预期失败，验证摘要将在按钮下方显示一些信息消息。验证发生在客户端上，不发生回发。如何防止页面在验证失败后跳转到顶部位置？

所以这一切都按照希望运作。但令人不安的是，当我点击提交按钮时，页面移动（“跳转”）到最高位置。要查看验证摘要，必须再次向下移动页面。

我试图将ShowSummary属性设置为false（这没什么意义）：验证仍然有效（无回发），但在这种情况下，页面不会移动到顶部位置。所以这个问题似乎取决于渲染验证文本。

有没有办法阻止这个页面跳转？

预先感谢您！

更新：

我上面描述的行为似乎并没有要依赖于浏览器。我在五种不同的浏览器中进行了测试，并且它们在任何地方都一样。

来源

2010-04-10 Slauma

参见http://stackoverflow.com/questions/699171/asp-net-validation-summary-causes-page-to-jump-to-top – 2010-08-23 23:47:48

我问过关于ASP的问题.net（http://forums.asp.net/p/1545969/3779312.aspx）并获得了两种解决方案的回复。更好的是这块Javascript保持滚动位置：

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

这只是放在页面上，无处可调。

另一种解决方案类似于RioTera的建议（使用MaintainScrollPositionOnPostBack），但将EnableClientScript="false"添加到验证器以强制回发。它也可以工作，但价格是人为的回发。

来源

2010-04-11 21:10:50 Slauma

这很棒。感谢发布...快速提问：如果JavaScript被禁用，该怎么办？ – nicorellius 2012-06-27 23:36:06

@nicorellius：那么它不会工作。我认为'Page.MaintainScrollPositionOnPostBack'需要启用Javascript。我不知道是否有没有Javascript的解决方案。 – Slauma 2012-06-27 23:45:54

您可以使用页面属性MaintainScrollPositionOnPostBack：

在后台代码：

Page.MaintainScrollPositionOnPostBack = true;

或WebForm中：

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

来源

2010-04-10 13:11:15 riotera

因为我没有它不工作回传。在客户端验证失败，这个“页面跳转”似乎是纯粹的客户端行为。 – Slauma 2010-04-10 13:18:22

它在母版页的页面指令中不起作用。在这种情况下，您可以在system.web/pages的web.config文件中将属性设置为maintaincrollPositionOnPostBack – rdans 2014-09-02 11:59:40

尝试设置页面焦点Page.SetFocus(control); 我有一个插入按钮，添加一个额外的行我的GridView，这是一个页面上的许多项目中的一个，所以我可以添加Page.SetFocus(control)在我btnInsert_Click事件的最后一个方法。

来源

2012-03-19 17:30:53 Kate

谢谢。这一个为我工作。使用MaintainScrollPositionOnPostback使页面闪烁。我发现control.Focus（）比Page.SetFocus（控制）更平滑一些。 – NoBullMan 2017-08-31 13:35:22

页面闪烁，因为整个页面被回发到服务器，并且内容从服务器再次发回。您需要使用UpdatePanel标记环绕要刷新的位置。它只会回传这是标签

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

内的信息阅读http://msdn.microsoft.com/en-us/library/bb386573(v=vs.100).aspx#CodeExamples

来源

2013-01-14 23:05:42

可惜MantainScrollPositionOnPostback不能在现代浏览器中正常工作了。对于您可以使用此代码片段一个跨浏览器兼容的解决方案（需要的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>

参见我的答案here。

来源

2014-12-16 13:47:19 Darkseal

我发现，设置属性：

maintainScrollPositionOnPostBack="true"

在Web.config <pages>部分效果很好。

来源

2015-06-08 18:10:39 Freddie

我正在使用MVC5，停止跳转的唯一方法是使用下面的JQuery代码。

我已经在Safari，Chrome，Mozilla，Internet Explorer和Opera上测试过这个解决方案。

$(document).scrollTop($('form#formCheckout').offset().top); 
    event.stopPropagation(); 
    event.preventDefault();

来源

2015-07-17 03:16:37

如何防止页面在验证失败后跳转到顶部位置？

回答

相关问题