JQGrid以编程方式选择网格行 [英] JQGrid Programmatically Select Grid Row

问题描述

我有一个带有loadonce:true(所以它是所有客户端)和分页功能(例如20页)的JQGrid.

I have a JQGrid with loadonce:true(so it's all client side) and paging enabled(with, say 20 pages).

我想指定一行(以编程方式，无需用户输入)，并使我的网格导航到相应的页面以选择指定的行.

I would like to specify a row(programmatically, without user input) and have my grid navigate to the corresponding page to select the specified row.

当前的JQGrid有可能吗?

Is this possible with the current JQGrid?

我已经研究过搜索和过滤器，但是只是用新的行重新加载了网格-我需要网格才能导航到正确的页面-保留其数据和结构.

I've looked into search and filter, but that just reloads the grid with new rows - I need my grid to navigate to the correct page - Keeping its data and structure.

我正在优化网格结构，因此可能需要进行任何更改(例如，从客户端到服务器端).

I'm in the process of optimizing my grid structure, so any changes needed(say client side to server side) would be possible.

推荐答案

由于使用loadonce:true，因此需要在服务器上准备数据.在服务器端，您可以决定必须选择哪一行.在服务器端，您还可以轻松计算所选行将在哪一页上.所选行和所选页面的ID例如可以作为用户数据.因此，从服务器发送的数据可能如下所示:

Because you use loadonce:true, then you prepare the data on the server. On the server side you can decide which row must be selected. On the server side you can also easy calculate on which page will be the selected row. The id of selected row and the selected page you can for example include as a part of the userdata. So the data sent from the server could looks like following:

{
    "total": 5,
    "page": 1,
    "records": 107,
    "rows": [
        ...
    ],
    "userdata": {
        "page": 3,
        "selId": 24 
    }
}

在loadComplete内部，您可以执行以下操作

Inside of loadComplete you can do about following

loadComplete: function(data) {
    if (jQuery("#list").getGridParam('datatype') === "json") {
        // data.userdata is the same as jQuery("#list").getGridParam('userData');
        var userdata = jQuery("#list").getGridParam('userData');
        var curPage = jQuery("#list").getGridParam('page'); // is always 1
        if (curPage !== userdata.page) {
            setTimeout(function(){
                jQuery("#list").setGridParam(
                    { page: userdata.page }).trigger("reloadGrid");
                jQuery("#list").setSelection (userdata.selId, true);
            },100);
        }
        else {
            jQuery("#list").setSelection (userdata.selId, true);
        }
    }
}

您可以在 http://www.ok- soft-gmbh.com/jqGrid/DataToSelect.htm 和 http: //www.ok-soft-gmbh.com/jqGrid/DataToMultiSelect.htm .

更新:免费jqGrid 支持multiPageSelection:true选项分层与版本4.10.0.该选项允许非常容易地设置对网格中多个行的选择(并且工作非常迅速，因为它在创建网格体的过程中直接设置了选择状态).参见答案和自述文件为4.10.0 .

UPDATE: Free jqGrid supports multiPageSelection:true option strarting with the version 4.10.0. The option allows to set selection of multiple rows in the grid very easy (and it works very quickly, because it set selection state directly during creating the body of the grid). See the answer and the demo and the readme to 4.10.0.

这篇关于JQGrid以编程方式选择网格行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！