Ajax更新面板滚动条问题

问题描述 投票:0回答:3

我有一个更新面板,里面有数据列表。

此更新面板每1秒触发一次以从db检索数据。

我已将此更新面板保留在启用了垂直滚动的div标签中。

但是当我获得新数据时,滚动条不会自动调整!!

我尝试过maintainscrollback选项,但是它不起作用。

在updatepanel触发后,是否有任何选项可以将滚动条保持在其原始位置?

ajax updatepanel scrollbar asynchronous-pages
3个回答
1
投票

这里是我更希望避免使用JavaScript的JavaScript,它需要每次刷新/更新时都要调整滚动位置...

我想您必须设计如下页面

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional/Always">
    <ContentTemplate>
        <div style="height: 400px/300px; overflow-y:scroll;"> 
            <asp:DataList ID="DataList1" runat="server">
                ....
            </asp:DataList>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>

将其更改为类似这样的内容应解决滚动问题

<div style="height: 400px/300px; overflow-y:scroll;"> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional/Always">
        <ContentTemplate>
                <asp:DataList ID="DataList1" runat="server">
                    ....
                </asp:DataList>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>

2
投票

请尝试以下方法:

<script>
  var prm = Sys.WebForms.PageRequestManager.getInstance();
  prm.add_beginRequest(function(){
     window.dTop = document.getElementById('divIdHere').scrollTop;
  });

  prm.add_endRequest(function(){
       setTimeout(function(){
         document.getElementById('divIdHere').scrollTop = window.dTop;
      },100);
  });
</script>

0
投票

将内部放入即可解决我的问题。

因此,更改以下内容

<UpdatePanel>
    <ContentTemplate>
         <div>
        </div>
    </ContentTemplate>
</UpdatePanel>

to,

<div>
<UpdatePanel>
    <ContentTemplate>
    </ContentTemplate>
</UpdatePanel>
</div>
© www.soinside.com 2019 - 2024. All rights reserved.