javascript - 将选定的行从 Jqgrid 移至顶部

Question

我在“多选”模式下使用 jqgrid，并且没有分页。当用户使用鼠标单击选择单个记录时，有什么方法可以将这些选定的记录带到网格顶部吗？

预先感谢您的帮助。

Answer 1

在评论中与您进行小型讨论后，我可以重新表述您的问题:“如何通过多选列实现排序？”

问题发现非常有趣，所以我投入了一些时间，并且可以在 jqGrid 保存本地数据(datatype 不是“xml”或“json”或具有“loadonce: true' 选项)。

首先，您可以找到演示我的建议的工作演示 here :

实现由两部分组成:

1. 将选择作为本地数据的一部分。作为奖励，在本地数据分页期间将保持选择。此功能非常有趣，独立于按多选列排序。
2. 多选列排序的实现。

为了实现保存选择，我建议扩展本地 data 参数，该参数使用新的 bool 属性 cb 保存本地数据(与多选列)。下面是实现:

multiselect: true,
onSelectRow: function (id) {
    var p = this.p, item = p.data[p._index[id]];
    if (typeof (item.cb) === "undefined") {
        item.cb = true;
    } else {
        item.cb = !item.cb;
    }
},
loadComplete: function () {
    var p = this.p, data = p.data, item, $this = $(this), index = p._index, rowid;
    for (rowid in index) {
        if (index.hasOwnProperty(rowid)) {
            item = data[index[rowid]];
            if (typeof (item.cb) === "boolean" && item.cb) {
                $this.jqGrid('setSelection', rowid, false);
            }
        }
    }
}

要使“cb”列(多选列)可排序，我建议执行以下操作:

var $grid = $("#list");

// ... create the grid

$("#cb_" + $grid[0].id).hide();
$("#jqgh_" + $grid[0].id + "_cb").addClass("ui-jqgrid-sortable");
cbColModel = $grid.jqGrid('getColProp', 'cb');
cbColModel.sortable = true;
cbColModel.sorttype = function (value, item) {
    return typeof (item.cb) === "boolean" && item.cb ? 1 : 0;
};

更新:The demo包含基于相同想法的一些改进代码。