冻结 gridview 标头和 SUB 标头
Posted
技术标签:
【中文标题】冻结 gridview 标头和 SUB 标头【英文标题】:Freezing gridview header and SUB headers 【发布时间】:2014-10-27 14:08:37 【问题描述】:在 SO 和其他地方提出了多个关于冻结/固定 GridView 标头的问题。我目前正在为单个标题 GridView 使用其中一个插件。
但它不是很优雅。由于调用 jQuery 函数后标题列与数据列不对齐。
带圆圈的列轮廓显示“未对齐”。
除了未对齐的问题外,还需要冻结另一个 GridView 的标题和子标题,如下所示。
现在这引起了一些担忧。
-
为子标题编写新的 jQuery 插件。 The plug-in I am currently using refers to this post. 我需要大量的知识支持来写一个新的。
创建两个不同的 Gridview,一个用于标题,一个用于数据。并且会有对齐问题(因为它是最早的设计)。此外,所有这些网格视图都执行 DML/CRUD 操作。
是否可以为标题编写html代码并隐藏GridView的标题?然而,这在管理与内容/数据相关的动态对齐方面也将面临挑战。
鉴于这种情况和选项,我只是对成本更低(时间/精力)的方向感到困惑,但对于未来的更新具有灵活性。也感谢编辑当前 jquery 函数以适应单个标题 GridView 的正确对齐的任何见解。
【问题讨论】:
【参考方案1】:由于您已经为此使用了一个插件,相信您使用另一个插件应该不难,但这次它应该使您的标题宽度与您的数据列对齐。确保使用ItemStyle-Width
属性为boundcolumn
或TemplateField
定义/调整列宽
链接到 GridViewScroll Demo 可以完美地完成这项工作。从here 下载插件。 对于类似的问题,请参考我在 SO 上的其他答案 here 和 here
这里是代码
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/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 type="text/javascript" src="gridviewScroll.min.js"></script>
<link href="GridviewScroll.css" rel="stylesheet" />
function pageLoad(sender, args)
gridviewScroll ();
function gridviewScroll()
gridView1 = $('#GridView1').gridviewScroll(
width: 915,
height: 449,
railcolor: "#F0F0F0",
barcolor: "#CDCDCD",
barhovercolor: "#606060",
bgcolor: "#F0F0F0",
freezesize: 5,
arrowsize: 30,
varrowtopimg: "../../../images/arrowvt.png",
varrowbottomimg: "../../../images/arrowvb.png",
harrowleftimg: "../../../images/arrowhl.png",
harrowrightimg: "../../../images/arrowhr.png",
headerrowcount: 1,
onScrollVertical: function (delta)
// store the scroll offset outside of this function in a hidden field and restore if you want to maintain vertical scroll position
,
onScrollHorizontal: function (delta)
//store the scroll offset outside of this function in a hidden field and restore if you want to maintain horizontal scroll position
);
【讨论】:
以上是关于冻结 gridview 标头和 SUB 标头的主要内容,如果未能解决你的问题,请参考以下文章
R Shiny 中 DT::datatable() 中冻结标头问题的解决方法
WPF:将Combobox添加到GridViewColumn标头中