jqgrid冻结列怎么将对应的底部合计行一起冻结
时间: 2024-02-21 07:58:07 浏览: 24
在 jqGrid 中,要将底部合计行与冻结列一起冻结,可以使用以下步骤:
1. 在 jqGrid 中,使用 `setFrozenColumns()` 方法来冻结列。例如,如果要冻结前两列,可以使用以下代码:
```
$("#grid").jqGrid('setFrozenColumns', true, 2);
```
2. 使用 `footerrow` 属性来添加底部合计行。例如,可以使用以下代码:
```
$("#grid").jqGrid('footerData', 'set', { column1: '合计', column2: sum });
```
3. 将 `footerrow` 与冻结列一起冻结。为此,可以使用以下 CSS 样式:
```
.ui-jqgrid .frozen-div .ui-jqgrid-ftable {
overflow: hidden;
}
```
这个样式将 `frozen-div` 类下的 `ui-jqgrid-ftable` 元素的 `overflow` 属性设置为 `hidden`,这样底部合计行就会随着冻结列一起冻结。
请注意,以上代码中的 `column1` 和 `column2` 应该替换为实际的列名和对应的合计值。
相关问题
jqgrid使用冻结列后会遮罩底部汇总行怎么解决
在 jqgrid 中使用冻结列时,底部汇总行被遮罩的问题可以通过设置底部汇总行的 z-index 属性来解决。
具体的实现方法如下:
1. 在 jqgrid 中定义底部汇总行:
```
footerrow: true,
userDataOnFooter: true,
```
2. 在页面的 CSS 样式中,设置底部汇总行的 z-index 属性:
```
.ui-jqgrid .ui-jqgrid-ftable {
z-index: 9999;
}
```
通过将底部汇总行的 z-index 属性设置为一个较大的值,可以使其在页面上处于较高的层级,从而避免被冻结列遮罩的问题。
需要注意的是,如果在 jqgrid 中使用了其他插件或组件,可能会出现 z-index 值冲突的问题,此时需要根据实际情况对 z-index 值进行调整。
jqgrid表格冻结列之后如何排序
在 jqgrid 表格中,如果开启了列冻结功能,排序需要注意以下几点:
1. 需要设置排序的列不能被冻结,否则无法进行排序操作。
2. 由于冻结列和非冻结列是分开的,所以需要分别设置排序相关的参数。
例如,假设我们要对表格中第2列进行排序,同时第1列被冻结,代码如下:
```javascript
$("#grid").jqGrid({
// ...
frozenColumns: [{name: 'col1', index: 'col1', frozen: true}], // 冻结第1列
colModel: [
{name: 'col1', index: 'col1', frozen: true}, // 第1列
{name: 'col2', index: 'col2', sortable: true}, // 第2列,可排序
{name: 'col3', index: 'col3', sortable: true}, // 第3列,可排序
// ...
],
// ...
});
```
需要注意的是,由于第1列被冻结,所以它的 `sortable` 属性应该设置为 `false`,否则会出现排序异常的情况。
另外,如果需要对多列进行排序,可以在 `sortname` 参数中指定多个列名,例如:
```javascript
$("#grid").jqGrid('setGridParam', {
sortname: 'col2,col3', // 先按第2列排序,再按第3列排序
sortorder: 'asc' // 升序排序
}).trigger('reloadGrid');
```
这样就可以按照指定的列进行排序了。