jqGrid：固定行 [英] jqGrid: fixed row

问题描述

是否可以在固定位置设置行？例如，我们现在有一个总行，我们总是希望在排序等之后将总数排在最前面。

Is it possible to set a row on a fixed position? For example, we have now a total row, and we always want the total on top, after sorting etc.

这是否有插件？

我们试图通过重新绘制整个表来在onLoadComplete中执行此操作：

We have tried to do this in the onLoadComplete by redrawing the whole table like so:

var rowIDs = $(this).getDataIDs();
var rowID, columnID;
$(this).clearGridData(); 
for (rowID in rowIDs) {
  for (columnID in data.rows[rowID]) {
    $(this).addRowData(rowIDs[rowID], data.rows[rowID], (data.rows[rowID][columnID].first ? 'first' : null));
    break; // Only do this for the first column
  }
}

但是对于性能不好，我们有数千行。

but that is bad for performance, we have thousands of rows.

在Oleg的评论之后：

after Oleg's comment:

总行只是我们的数据集中的一行。数据集具有以下格式：

The total row is just a row from our dataset. The dataset has this format:

列：'网络'，'点击'，'视图'

Columns: 'Network', 'Clicks', 'Views'

data = [
  {
    'Network': {value:'Google'}, 'Clicks': {value:38392882}, 'Views':{value:3939922}
  },
  {
    'Network': {value:'Sanoma'}, 'Clicks': {value:177883}, 'Views':{value:39293}
  },
  ...
  ,
  {
    'Network': {value:'Total'}, 'Clicks': {value:993832732223}, 'Views':{value:3932293939}, 'first': true
  },
  ...

]
}

因此我们在数据行中设置我们想要的行（'first'：true）。

So we set in our datarow which row we want to have on top ('first':true).

通过处理，我们使用它来设置在表的顶部。希望这更容易理解：）

By processing, we use that to set in on top of the table. Hopefully this is more understandable :)

提前致谢，

Eddy

推荐答案

页脚放在div中，类为ui-jqgrid-sdiv，它通常放在div下面，类为ui-jqgrid- bdiv主网格包含的位置。因此，要将页脚移动到页面顶部，您需要移动页脚div。此外，您应该将底部边框放置在您需要的样式中。代码可以如下所示：

The footer are placed in the div with the class "ui-jqgrid-sdiv" and it is placed typically below the div with the class "ui-jqgrid-bdiv" where the main grid contain are placed. So to move the footer on top of page you need to move the the footer div. Additionally you should place bottom border in the style which you need. The code could be like the following:

$('div.ui-jqgrid-sdiv').css({
    "border-bottom-style":"solid",
    "border-bottom-color":"#a6c9e2",
    "border-bottom-width":"2px"
}).insertBefore($('div.ui-jqgrid-bdiv'));

因此您将收到

as the result you will receive

观看现场演示这里。

这篇关于jqGrid：固定行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！