ASP.NET学习笔记[10] - GridView点击行按钮的时候固定滚动条的实现方法

GridView显示的内容行数比较多需要垂直方向滚动条,但是遇到这样一个问题,如果我们把滚动条拖到最下面,此时点击GridView行按钮事件,不论是刷新页面其它控件还是弹出一个alert,都会导致GridView的滚动条自动回到第一行状态,用户之前滑动到的位置丢失了,用户需要再次将滚动条拖到上次的位置,操作麻烦,影响用户体验.

解决方案:用js记录滚动条坐标,实现锚定效果

在页面上添加两个HiddenField,分别记录X轴和Y轴滚动条坐标,这里有一个小细节,因为我的页面使用了UpdatePanel,所以在获取HiddenField控件ID的时候,应该用这种写法<%=dvscrollX.ClientID %>,如果不用UpdatePanel的话就直接写dvscrollX即可,对于div而言不管用不用UpdatePanel,都可以直接写成div1

GridView控件外侧的div标记增加js代码 οnscrοll="javascript:RecordPostion(this);"

后台代码

protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            string pipelineId = e.CommandArgument.ToString();  //获取管线id

            if (e.CommandName == "Details")    //查看明细
            {
                //做相应的操作... 

                //加载js代码，调用GetResultFromServer()方法
                string sjs = "GetResultFromServer();"; 
                ScriptManager.RegisterClientScriptBlock(this.GridView1, this.GetType(), "", sjs, true);

            }
        }

最后说明：问题解决思路来自 gridview刷新问题，滚动条如何固定住-CSDN论坛