Question

当我向下滚动时我需要保留列标题，当我向下滚动时我需要保持滚动位置进行编辑，页面进行回发。

我无法弄清楚如何同时做两件事，但我可以单独做。我不知道如何用javascript做到这一点。这就是两种功能的外观。

我使用此link来保存滚动位置，并使用此link来保持列标题的固定。

正如我所说，他们各自分开工作，但我如何将它们结合起来？

<head id="Head1" runat="server">
    <title>Fixed Header GridView</title>
    <link href="Styles/GridviewScroll.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
    <script src="Scripts/gridviewScroll.min.js" type="text/javascript"></script>
    <script type="text/javascript">

        $(document).ready(function () {
            gridviewScroll();
        });

        function gridviewScroll() {
            $('#<%=GridView1.ClientID%>').gridviewScroll({
                width: 5300,
                height: 950,
                startHorizontal: 0,
                wheelstep: 10,
                barhovercolor: "#3399FF",
                barcolor: "#3399FF"
            });
        }

        function scrollPosition() {
            var scroll = {
                Y: '#<%= hfScrollPosition.ClientID %>'
            };

            $(document).ready(function () {
                $("#scrollable-container").scrollTop($(scroll.Y).val());
            });
        }



       </script>
</head>
<body>
    <form id="form1" runat="server">
            <asp:GridView ID="GridView1" runat="server" Width="660px" 
                AutoGenerateColumns="False" DataSourceID="SqlDataSource1" EnableModelValidation="True" ShowFooter="True" HorizontalAlign="Left">
                <Columns>

Answer 1

<script type="text/javascript" src="../Scripts/gridviewScroll.min.js"></script> 
<script type="text/javascript">

    $(document).ready(function () {
        gridviewScroll();
    });

    function gridviewScroll() {
        $('#<%=GridView1.ClientID%>').gridviewScroll({
            width: 1175,
            height: 500,
            freezesize: 3,
            startVertical: $("#<%=hfGridView1SV.ClientID%>").val(),
            startHorizontal: $("#<%=hfGridView1SH.ClientID%>").val(),
            onScrollVertical: function (delta) {
                $("#<%=hfGridView1SV.ClientID%>").val(delta);
            },
            onScrollHorizontal: function (delta) {
                $("#<%=hfGridView1SH.ClientID%>").val(delta);
            }
        });
    }

<asp:HiddenField ID="hfGridView1SV" runat="server" /> 
<asp:HiddenField ID="hfGridView1SH" runat="server" />

<asp:GridView ID="GridView1" runat="server" Width="660px" 
                AutoGenerateColumns="False" DataSourceID="SqlDataSource1" EnableModelValidation="True" ShowFooter="True" HorizontalAlign="Left">

您缺少代码中的隐藏字段。查看演示here.

Answer 2

为了在Postback后保持滚动位置，我在http://www.codeproject.com/Articles/30235/Maintain-GridView-Scroll-Position-and-Header-Insid

使用了优秀的解决方案

然而HeaderFreez描述那里并没有为我工作，我尝试了几十个解决方案，直到我得出结论，人们可以简单地复制gridview。第一个只有标题，第二个只包含数据。

为了显示标题而没有行，只需使用ShowHeaderWhenEmpty =＆＃34; True＆＃34; teh gridview的财产。您仍然必须绑定此网格（限于标题）并编写一些不会返回任何数据的查询（例如select * from age from age = -100）

在gridview asp中维护GridView Scroll Position和固定标题

2 个答案: