Gridview实现冻结列

来源：互联网发布：图标设计软件编辑：程序博客网时间：2024/04/27 15:48

Gridview实现冻结列：数据的列比较多，想把首列固定下来，让其它的列可以实现左右滚动
实现：在gridview外面套一个带有滚动条的div
页面上定义css样式：
.freeze
{ z-index:120; left:expression(this.offsetParent.scrollLeft); position:relative;border:1px solid;border-bottom:0;border-right:0}
.freezeHeader_bg{background:#859FD4}
.freezeItem_bg{background:#fff}

后台代码里：
/// <summary>
        /// gridview数据绑定
        /// </summary>
        private void StoreListBind(string strCondition)
        {
            SqlDataReader drStorage = back.getStoreList(Pager.PageSize, Pager.CurrentPageIndex, false, strCondition);
            if (drStorage != null)
            {
                DataTable dtStorage = tools.ConvertDataReaderToDataTable(drStorage);
                dtStorage.TableName = "EC_Web_StoreInfo";

                //冻结列加载样式
                this.gdvStore.Columns[0].HeaderStyle.CssClass = "freeze freezeHeader_bg";
                this.gdvStore.Columns[0].ItemStyle.CssClass = "freeze freezeItem_bg";

                this.gdvStore.DataSource = dtStorage.DefaultView;
                gdvStore.DataBind();
            }
        }

运行效果：这是滚动前，注意比较第一列和后面的列

滚动条滚动：对了，我的gridview是放在一个有滚动条的div里面