Сброс позиции прокрутки после обратной передачи Async - ASP.NET

Question

Каков наилучший способ сбросить положение прокрутки до верхней части страницы после асинхронной обратной передачи?

Асинхронная обратная передача инициируется из столбца CommandField ASP.NET GridView, а панель обновления панели обновления ASP.NET вызывается в GridView OnRowCommand.

Мое настоящее приложение является веб-сайтом ASP.NET 3.5.

EDIT: Я получил отличные отзывы от всех, и я закончил с использованием метода PageRequestManager в теге сценария, но мой следующий вопрос:

Как настроить его выполнять только тогда, когда пользователь нажимает ASP.NET CommandField в моем элементе управления GridView? У меня есть другие кнопки на странице, которые выполняют асинхронную обратную передачу, которую я не хочу прокручивать до верхней части страницы.

EDIT 1: Я разработал решение, в котором мне не нужно использовать PageRequestManager. См. Мой последующий ответ для решения.

Answer 1

Вот следующее решение, которое я разработаны на основе этой source

ASP.NET Webform

<script language="javascript" type="text/javascript"> 
    function SetScrollEvent() { 
     window.scrollTo(0,0); 
    } 
</script> 

<asp:GridView id="MyGridView" runat="server" OnRowDataBound="MyGridView_OnRowDataBound"> 
    <Columns> 
     <asp:CommandField ButtonType="Link" ShowEditButton="true" /> 
    </Columns> 
</asp:GridView> 

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();"); 
      } 
     } 
    } 
} 

Answer 2

Вы установили свойство страницы MaintainScrollPosition? Не уверен, что это было бы иначе, если вы делаете Async Postback или нет.

Редактировать: Одна вещь, которую вы могли бы попытаться, - установить фокус на определенный предмет в верхней части страницы, что может помочь и быть грязной работой.

Answer 3

Как вы используете UpdatePanels вы собираетесь нужно подключить в ASP.NET AJAX PageRequestManager

Вам нужно добавить метод к endRequest крючками событий, которые:

Поднят после завершения асинхронной обратной передачи и возврата в браузер.

Таким образом, вы бы что-то вроде:

<script type="text/javascript"> 
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(pageLoaded); 

    function pageLoaded(sender, args) { 
    window.scrollTo(0,0); 
    } 
</script> 

который заставит браузер для прокрутки назад в верхней части страницы, как только запрос обновление завершено.

Есть другие события, которые вы могли бы вклиниться вместо курса:

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, так как нет «полная перезагрузка страницы» происходит, в этом случае вы действительно хотите, чтобы этот эффект произошел, поэтому вам нужно будет вручную его создать.

Редактировать, чтобы ответить на вопрос обновляемой

Ok, так что если вам нужно только сбросить постион на определенные нажатия кнопок вам нужно сделать что-то вроде этого:

начать зацепив в BeginRequest вместо/а:

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

Это происходит потому, что у параметра арг вы получите доступ к:

args.get_postBackElement().id 

Что скажет вам идентификатор кнопки, которая запустила все событие - вы можете либо проверить значение здесь, либо переместить страницу, либо сохранить ее в переменной, и запросить ее в конце запроса - осознавая условия гонки и т. д., когда пользователь нажимает на другую кнопку до завершения вашего первоначального обновления.

Это должно вам начать работу с любой удачей - есть немало примеров вокруг этого на Working with PageRequestManager Events

Answer 4

Вы используете ASP.NET AJAX? Если это так, в клиентских библиотеках есть два очень полезных события: beginRequest и endRequest, одна из проблем с частичными/асинхронными обратными передачами, заключается в том, что общая страница не знает, что вы делаете. события begin и endrequest позволят вам поддерживать положение прокрутки на клиенте, вы можете иметь переменную js, которая установлена ​​в положение прокрутки в начале запроса, а затем в конце запроса вы можете сбросить требуемый scrollTop элемента, который вам нужен. i'm Конечно, я видел это раньше, но не могу найти ссылку. больной после, если я найти пример

Answer 5

Я использую скрытый ввод, называемый hScrollTop, который я установил, прежде чем форма asp.net будет отправлена ​​обратно. Затем, когда страница загружается, она устанавливает scrollTop в соответствии со значением скрытого ввода.

Попробуйте этот код на новой странице.

<div style="height:500px"></div> 

<form id="Form1" runat=server onsubmit="javascript:saveScrollTop();"> 
    <input type=submit value="Submit" runat=server> 
    <input type="hidden" id="hScrollTop" runat=server> 
</form> 

<div style="height:1000px"></div> 

<script language="javascript"> 
    function saveScrollTop() { 
     document.getElementById("<%= hScrollTop.ClientID %>").value = document.body.scrollTop; 
     return true; 
    } 

    window.onload = function() { 
     document.body.scrollTop = document.getElementById("<%= hScrollTop.ClientID %>").value; 
    } 

</script> 

Answer 6

взяты из этого урока:

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

Положим MaintainScrollPositionOnPostback = истинный

Затем, если нужно сбросить положение прокрутки вызова метода:

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 

Answer 7

Здесь является идеальным решением для сброса позиции полосы прокрутки в TOP в AJAX

стороне клиента Код

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

Server Side Code

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

Только window.scrollTo (0,0) не будет работать. В этом случае Ajax будет иметь приоритет, поэтому вам нужно будет использовать функцию setTimeout.

Answer 8

Page.RegisterStartupScript("MyScript", "<script language=javascript>setTimeout('window.scrollTo(0,0)', 0);</script>"); 

Помещенный выше функции, которую вы хотите сказать, чтобы перейти к началу страницы. Например, когда страница недействительна, добавьте туда и добавьте временный javascript, чтобы снять вас в верхней части страницы.