如何在jQgrid中对行进行排序后获取新的行顺序?

时间:2018-01-26 14:23:28

标签: javascript jquery jqgrid free-jqgrid

我有以下网格定义:

$(document).ready(function () {
    $("#thegrid").jqGrid({
        url: "/ajax/questions/get/" + form_id,
        datatype: "json",
        colNames: ['id', 'grid_id', 'seq', 'type', 'text'],
        colModel: [
            {name: 'field_id', index: 'id', width: 100, editable: false, search: false},
            {name: 'grid_id', index: 'grid_id', width: 50, editable: false, search: false},
            {name: 'field_seq', index: 'seq', width: 45, editable: false, search: false},
            {name: 'type', index: 'type', width: 125, editable: false, search: false},
            {name: 'field_name', index: 'text', width: 585, search: false}
        ],
        autowidth: true,
        rowNum: 200,
        cmTemplate: {width: 300, autoResizable: true},
        iconSet: "fontAwesome",
        guiStyle: "bootstrap",
        autoResizing: {compact: true, resetWidthOrg: true},
        viewrecords: true,
        autoencode: true,
        sortable: true,
        pager: true,
        toppager: true,
        hoverrows: true,
        multiselect: true,
        multiPageSelection: false,
        rownumbers: true,
        loadonce: true,
        autoresizeOnLoad: true,
        forceClientSorting: true,
        ignoreCase: true,
        prmNames: {id: "field_id"},
        jsonReader: {id: "field_id"},
        localReader: {id: "field_id"},
        navOptions: {edit: false, add: false, search: false, del: false, refresh: true},
        pgbuttons: false,
        pginput: false,
        caption: "Questions",
        height: 100,
        editurl: '/ajax/questions/edit',
        onSelectRow:
            function () {
                // ....
            },
        loadComplete: function () {
            // ...
        }
    })
});

使用上面的代码,可以通过拖动行并在网格的某个位置放下来对行进行排序。

为了保持这种变化,我在后端有一个函数,它带有form_id(我将它存储在sessionStorage中)和一个field_id => field_seq数组,并在数据库级别做了一些魔术。< / p>

看看下面的图片,这是第一次加载的网格:

enter image description here

现在让我们说我拖延了&amp;将彩色行(id: 219110)放入第一行位置。这将使第一行(id: 219110)向下移动一行(在该行之后的所有行都会发生相同的行),然后移动的行将占据第一个位置。见下面的例子:

之前:

+--------+--------+-----+
| id     | gri_id | seq |
+--------+--------+-----+
| 219111 |        | 1   |
| ...    |        | ... |
| 219110 |        | 4   |
+--------+--------+-----+

后:

+--------+--------+-----+
| id     | gri_id | seq |
+--------+--------+-----+
| 219110 |        | 1   |
| 219111 |        | 2   |
| ...    |        | ... |
+--------+--------+-----+

我需要使用id作为keyseq作为值来构建和数组,以便稍后我可以将其传递给关注商店的AJAX后端函数新数据。

我如何实现这一目标?

1 个答案:

答案 0 :(得分:1)

您可以使用jqGrid的lastSelectedData参数来获取用户之前已排序和过滤的项目。旧答案:this oneanother one提供了演示,演示了lastSelectedData的用法。

通常,jqGrid内部包含一些JavaScript方法,用于排序和过滤本地数据。我在the old answer棘手的技术中描述,它适用于旧的jqGrid(i版本&lt; = 4.7)。已经在#34;免费jqGrid&#34;的第一个版本中fork我实现了lastSelectedData参数(参见the readme),这使得使用最后排序和过滤的本地数据非常容易。