c# – 通过Postback保留UpdatePanel中DIV的滚动位置

发布时间：2020-12-15 23:22:35 所属栏目：百科来源：网络整理

导读：我有一个显示在div中的GridView,它包含在asp.net页面上的UpdatePanel控件中. div设置为在显示大量信息时使GridView可滚动,同时使更新面板中的其他信息保持稳定. 无论如何,GridView中的项目是可点击的,但无论我尝试什么,都不会通过回发保留包含div的滚动位置.

我有一个显示在div中的GridView,它包含在asp.net页面上的UpdatePanel控件中. div设置为在显示大量信息时使GridView可滚动,同时使更新面板中的其他信息保持稳定.

无论如何,GridView中的项目是可点击的,但无论我尝试什么,都不会通过回发保留包含div的滚动位置.目前我正在尝试用jQuery来解决这个问题,因为这似乎是最简单的方法.我的代码如下：

<head id="Head1" runat="server">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

    <script type="text/javascript">
            var scroll = function () {
                Y: '#<%= scrollPos.ClientID %>'
            };

            $(document).ready(function () {
                $("#subResults").scrollTop($(scroll.Y).val());

                $('#subResults').scroll(function () {
                    $(scroll.Y).val(this.scrollTop);
                });
            });
        </script>
    </head>

    <body>
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="resultPanel" runat="server" ChildrenAsTriggers="True" UpdateMode="Conditional">
            <ContentTemplate>
                <div id="subResults">
                    <asp:GridView ID="resultGrid" runat="server"
                                    AutoGenerateColumns="false" Visible="True"
                                    AutoGenerateSelectButton="True"
                                    OnRowDataBound="resultGrid_RowDataBound"
 OnSelectedIndexChanged="resultGrid_SelectedIndexChanged">
                        <Columns>
                            // columns columns columns...
                        </Columns>
                    </asp:GridView>
                    <asp:HiddenField ID="scrollPos" runat="server" Value="0" />
                </div>
    </body>

我正在使用给定here的示例.无论我是否尝试完全按照给定的方式执行此操作,它都不起作用：我的GridView项目接受单击,执行它应该执行的操作,然后将GridView滚动回到在Postback完成后再次返回顶部.如何让我的div“subResults”通过Postback保持其滚动位置？

解决方法

解决.下面的代码块粘贴在我的脚本管理器对象下面,使得滚动div按照我想要的方式运行：

<script type="text/javascript">
    var xPos,yPos;
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_beginRequest(BeginRequestHandler);
    prm.add_endRequest(EndRequestHandler);
    function BeginRequestHandler(sender,args) {
        xPos = $get('scrollDiv').scrollLeft;
        yPos = $get('scrollDiv').scrollTop;
    }
    function EndRequestHandler(sender,args) {
        $get('scrollDiv').scrollLeft = xPos;
        $get('scrollDiv').scrollTop = yPos;
    }
</script>

归功于Andrew Frederick

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!