异步回发后重置滚动位置 – ASP.NET

在异步回发后将滚动位置重置到页面顶部的最佳方法是什么?

异步回发是从ASP.NET GridView CommandField列启动的,并且在GridView OnRowCommand中调用ASP.NET更新面板Update方法。

我当前的应用程序是ASP.NET 3.5网站。

编辑:我收到了大家的好评,我在脚本标签中使用了PageRequestManager方法,但我的下一个问题是:

如何将其配置为仅在用户单击GridView控件中的ASP.NET CommandField时执行? 我在页面上有其他按钮执行异步回发,我不想滚动到页面顶部。

编辑1:我开发了一个解决方案,我不需要使用PageRequestManager。 请参阅我的后续答案以获得解决方案

当您使用UpdatePanel时,您将需要挂钩到ASP.NET AJAX PageRequestManager

您需要向endRequest事件挂钩添加一个方法:

在异步回发完成并且控件已返回到浏览器后引发。

所以你有类似的东西:

 

一旦更新请求完成,这将强制浏览器滚动回页面顶部。

还有其他事件你可以挂钩而不是当然:

 beginRequest // Raised before the request is sent initializeRequest // Raised as the request is initialised (good for cancelling) pageLoaded // Raised once the request has returned, and content is loaded pageLoading // Raised once the request has returned, and before content is loaded 

异步回发的优点在于页面将保持滚动高度,而无需设置MaintainScrollPosition,因为没有“全页重新加载”发生,在这种情况下,您实际上希望发生这种效果,因此您需要手动创建它。

编辑以回复更新的问题

好的,所以如果您只需要在某些按钮按下时重置位置,您需要执行以下操作:

首先挂钩到BeginRequest,或者:

 Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler); 

这是因为在args参数中您可以访问:

 args.get_postBackElement().id 

这将告诉你启动整个事件的按钮的id – 然后你可以在这里检查值,移动页面,或者将它存储在变量中,并在最终请求中查询它 – 了解竞争条件,用户在原始更新完成之前单击另一个按钮。

这应该让你好运 – 在使用PageRequestManager事件时,有很多例子

这是在AJAX中将滚动条位置重置为TOP的完美解决方案

客户端代码

 function ResetScrollPosition() { setTimeout("window.scrollTo(0,0)", 0); } 

服务器端代码

 ScriptManager.RegisterStartupScript(Page, this.GetType(), "ScrollPage", "ResetScrollPosition();", true); 

只有,window.scrollTo(0,0)不起作用。 在这种情况下,Ajax将优先使用,因此您必须使用setTimeout函数。

以下是我根据此来源开发的以下解决方案

ASP.NET Webform

       

ASP.NET Webform代码背后

 protected void MyGridView_OnRowDataBound(object sender, GridViewRowEventArgs e) { if(e.Row.RowType.Equals(DataControlRowType.DataRow)) { foreach (DataControlFieldCell cell in e.Row.Cells) { foreach(Control control in cell.Controls) { LinkButton lb = control as LinkButton; if (lb != null && lb.CommandName == "Edit") lb.Attributes.Add("onclick", "SetScrollEvent();"); } } } } 

你在使用asp.net AJAX吗? 如果是这样,在客户端库beginRequest和endRequest中有两个非常有用的事件,部分/异步回发的问题之一是,一般页面没有弄清楚你在做什么。 begin和endrequest事件将允许你在客户端保持滚动位置,你可以在beginrequest上设置一个js设置为滚动位置,然后在结束请求你可以重置你需要的任何元素的scrollTop ..我是我确实以前见过这个,但找不到链接。 如果我找到一个例子,我会发帖

取自本教程:

http://aspnet.4guysfromrolla.com/articles/111407-1.aspx

我们设置MaintainScrollPositionOnPostback = true

然后如果我们需要重置滚动位置调用方法:

 Private Sub ResetScrollPosition() If Not ClientScript.IsClientScriptBlockRegistered(Me.GetType(), "CreateResetScrollPosition") Then 'Create the ResetScrollPosition() function ClientScript.RegisterClientScriptBlock(Me.GetType(), "CreateResetScrollPosition", _ "function ResetScrollPosition() {" & vbCrLf & _ " var scrollX = document.getElementById('__SCROLLPOSITIONX');" & vbCrLf & _ " var scrollY = document.getElementById('__SCROLLPOSITIONY');" & vbCrLf & _ " if (scrollX && scrollY) {" & vbCrLf & _ " scrollX.value = 0;" & vbCrLf & _ " scrollY.value = 0;" & vbCrLf & _ " }" & vbCrLf & _ "}", True) 'Add the call to the ResetScrollPosition() function ClientScript.RegisterStartupScript(Me.GetType(), "CallResetScrollPosition", "ResetScrollPosition();", True) End If End Sub 

您是否设置了页面属性MaintainScrollPosition? 如果您进行异步回发,不确定是否会有任何不同。

编辑:您可以尝试的一件事是将焦点设置在页面顶部附近的特定项目上,这可能会有所帮助,也可能是一个肮脏的工作。

我使用了一个名为hScrollTop的隐藏输入,我在asp.net表单发回之前设置了该输入。 然后,当页面加载时,它根据隐藏输入的值设置scrollTop。

在新页面上尝试此代码。

 
 Page.RegisterStartupScript("MyScript", ""); 

将上面的内容放在您要告诉的function上,转到页面顶部。 就像当页面无效时,在那里有它,它会添加临时的JavaScript来拍摄到页面的顶部。