2013-04-03 2 views
1

Я написал визуальную веб-часть SharePoint 2010, которая использует ASP.NET AJAX для частичной обратной передачи на панели обновления. Внутри веб-части есть функция поиска, в которой пользователь вводит условия поиска и обращается к элементу управления Button в UpdatePanel, который запрашивает веб-службу и связывает результаты с GridView, также в пределах той же UpdatePanel. Я хочу, чтобы страница прокручивалась до вершины сетки после того, как данные привязаны к GridView.Прокрутите до положения в веб-части SharePoint Visual Web после обратной отправки AJAX UpdatePanel

Разметки (сокращенно):

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" EnableViewState="true"> 
    <ProgressTemplate> 
    <div id="progressBackgroundFilter"></div> 
    <div id="processMessage"> 
     <h1>Processing<img src="/_layouts/WebPart/ajax-loader.gif" alt="" /></h1> 
    </div> 
    </ProgressTemplate> 
    <asp:Button ID="btnSearch" runat="server" OnClick="btnSearch_Click" Text="Search" Visible="true" ValidationGroup="SearchGroup" /> 
    <asp:GridView ID="InstancesGrd" runat="server" Visible="false" AutoGenerateColumns="false" OnRowCommand="InstancesGrd_RowCommand" GridLines="Vertical" BorderColor="White" CssClass="grid"> 
    </asp:GridView> 
</asp:UpdatePanel> 

CodeBehind (сокращенно):

protected void btnSearch_Click(object sender, EventArgs e) 
{ 
    ServiceClient client = ConfigureServiceProxy(); 
    List<string> data = client.returnResults(); 
    InstancesGrd.DataSource = data; 
    InstancesGrd.DataBind(); 
    InstancesGrd.Visible = true; 
} 

Javascript Код:

<script type="text/javascript"> 
    _spOriginalFormAction = document.forms[0].action; 
    _spSuppressFormOnSubmitWrapper = true; 
</script> 
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.1.min.js"></script> 
<script type="text/javascript"> 
    function pageLoad() {   

    $('.leftItem').hover(
     function() { 
      $('ul', this).css('display', 'block'); 
      $(this).css('background-image', 'url("_layouts/testclientwebpart/leftNavHover.gif")'); 
     }, 
     function() { 
      $('ul', this).css('display', 'none'); 
      $(this).css('background-image', 'url("_layouts/testclientwebpart/navBarLeft.gif")'); 
     } 
    ); 
    $('.rightItem').hover(
     function() { 
      $('ul', this).css('display', 'block'); 
      $(this).css('background-image', 'url("_layouts/testclientwebpart/rightNavHover.gif")'); 
     }, 
     function() { 
      $('ul', this).css('display', 'none'); 
      $(this).css('background-image', 'url("_layouts/testclientwebpart/navBarRight.gif")'); 
     } 
    ); 
    $('.middleItem').hover(
     function() { 
      $('ul', this).css('display', 'block'); 
      $(this).css('background-image', 'url("_layouts/testclientwebpart/middleNavHover.gif")'); 
     }, 
     function() { 
      $('ul', this).css('display', 'none'); 
      $(this).css('background-image', 'url("_layouts/testclientwebpart/navBarMiddle.gif")'); 
     } 
    ); 
     } 

Sys.WebForms.PageRequestManager.getInstance() add_beginRequest (. BeginRequest); Sys.WebForms.PageRequestManager.getInstance(). Add_pageLoaded (pageLoaded);

function beginRequest(sender, args) { 
    postbackElement = args.get_postBackElement(); 
    } 
    function pageLoaded(sender, args) { 
    if (typeof (postbackElement) === "undefined") { 
     return; 
    } 
    if ((postbackElement.id) === "ctl00_SPWebPartManager1_g_d2fd9460_f326_4df6_92c5_7afd7da02faa_ctl00_btnSearch") { 
     //--- Scroll test -- does not work 
     window.scrollTo(750, 0); 
    } 
    } 
</script> 

Я попытался с помощью ClientScriptManager.RegisterStartupScript на стороне сервера и PageRequestManager.getInstance(). Add_beginRequest() и add_pageLoaded(), чтобы добавить JavaScript обработчики событий OnClick стороне клиента функции Button. Я смог вызывать предупреждения от обоих, но не смог сбросить позицию прокрутки.

Я что-то упустил?

+0

Невозможно сбросить положение прокрутки? – Dolo

+0

Позиция полосы прокрутки на странице, которая превышает высоту окна. – maniak1982

ответ

0

Я в конце концов постигнет ответ на это, или, по крайней мере, почему он терпит неудачу. На главной странице этой части были настройки, которые изменили поведение по умолчанию. С тех пор я сменил работу, поэтому, к сожалению, забыл, что я сделал, чтобы исправить это, но новая главная страница отключила программную прокрутку. Когда я использовал одну и ту же главную страницу в области производства и разработки, я смог исправить эту проблему.

0

То, что вы пытаетесь достичь будет становиться все более проще с внутренними ссылками анкерных как этот

<a name="scrollTo1"></a>.

Вам необходимо поместить эти ссылки в те места, где вы хотите перейти.

Как только вы установили эти теги в соответствующих местах на своей странице, вы можете установить текущий url на url # scrollTo1, чтобы прокрутить этот раздел с помощью javascript.

+0

Спасибо. Почему-то якорь просто проскользнул. – maniak1982

+0

Во втором взгляде это работает только в том случае, если сетка не обновляется. Когда сетка обновляется, я всегда возвращаюсь к вершине частичной обратной передачи, и я не знаю, почему. – maniak1982

0

Попробуйте поместить свой вызов в SharePoint конкретные функции _spBodyOnLoadFunctionNames

function beginRequest(sender, args) { 
    postbackElement = args.get_postBackElement(); 
    } 
    function pageLoaded(sender, args) { 
    if (typeof (postbackElement) === "undefined") { 
     return; 
    } 
    if ((postbackElement.id) === "ctl00_SPWebPartManager1_g_d2fd9460_f326_4df6_92c5_7afd7da02faa_ctl00_btnSearch") { 
     //--- Scroll test -- does not work 
     //window.scrollTo(750, 0); 
     _spBodyOnLoadFunctionNames.push("scrollToTop"); 
    } 
    } 
    function scrollToTop() 
    { 
    window.scrollTo(750, 500); 
    } 
</script> 
Смежные вопросы