获取jqGrid中的所有行ID

时间:2011-06-20 18:16:52

标签: jquery jquery-plugins jqgrid

如何获取网格中每一行的ID,甚至跨页面?

getDataIDsgetRowData仅提供当前页面的ID。

谢谢!

4 个答案:

答案 0 :(得分:14)

只有当您拥有本地网格(datatype:'local'或拥有loadonce:true)时才有可能。在这种情况下,所有页面的所有数据包含ID都已在本地。在这种情况下,您可以使用_index参数,该参数通常与另一个更为已知的参数data一起使用。与

var idToDataIndex = $("#list").jqGrid('getGridParam','_index');

您将获得_index参数。它是一个具有网格所有id的属性的对象。所以你可以用

枚举id
var id;
for (id in idToDataIndex) {
    if (idToDataIndex.hasOwnProperty(id)) {
        // id is the rowid.
        // to get the data you can use
        // mydata[idToDataIndex[id]] where
        // var mydata = $("#list").jqGrid('getGridParam','data');
    }
}

答案 1 :(得分:0)

在jqGrid的更高版本中,他们推出了一个更适合这种情况的函数,因为它会考虑可能存在的任何工具栏过滤。 See Oleg's example here.因此,如果您有一个jqGrid(loadonce:true和/或数据类型:local),则以下将返回与当前过滤匹配的所有行ID(显示在当前页面及更高版本中)。

var allIdsWithFiltering = grid.jqGrid('getGridParam', 'lastSelectedData');

这将返回一个普通数组,与原始答案不同,后者返回一个具有必须枚举的属性的对象。

答案 2 :(得分:0)

还有另一种在jqgrid上的较旧版本中获取此数据的方法:

gRowNum = grid.jqGrid('getGridParam','rowNum');

grid.setGridParam({rowNum: '9999'});
grid.trigger("reloadGrid");
myList = grid.jqGrid('getDataIDs');

grid.setGridParam({rowNum: gRowNum});
grid.trigger("reloadGrid");

答案 3 :(得分:0)

考虑到自IE9以来支持Object.keys如果您只需要ID ,如今我会使用:

var idToDataIndex = $("#list").jqGrid('getGridParam','_index');
var ids = Object.keys(idToDataIndex);

$(function () {
    "use strict";
    $("#list").jqGrid({
        colModel: [
            { name: "name", label: "Client", width: 53 },
            { name: "invdate", label: "Date", width: 90, align: "center", sorttype: "date",
                formatter: "date", formatoptions: { newformat: "d-M-Y" },
                searchoptions: { sopt: ["eq"] } },
            { name: "amount", label: "Amount", width: 65, template: "number" },
            { name: "tax", label: "Tax", width: 41, template: "number" },
            { name: "total", label: "Total", width: 51, template: "number" },
            { name: "closed", label: "Closed", width: 59, template: "booleanCheckbox", firstsortorder: "desc" },
            { name: "ship_via", label: "Shipped via", width: 87, align: "center",
                formatter: "select",
                formatoptions: { value: "FE:FedEx;TN:TNT;DH:DHL", defaultValue: "DH" },
                stype: "select",
                searchoptions: { value: ":Any;FE:FedEx;TN:TNT;DH:DHL" } }
        ],
        data: [
            { id: "10",  invdate: "2015-10-01", name: "test",   amount: "" },
            { id: "20",  invdate: "2015-09-01", name: "test2",  amount: "300.00", tax: "20.00", closed: false, ship_via: "DH", total: "320.00" },
            { id: "30",  invdate: "2015-09-01", name: "test3",  amount: "400.00", tax: "30.00", closed: false, ship_via: "FE", total: "430.00" },
            { id: "40",  invdate: "2015-10-04", name: "test4",  amount: "200.00", tax: "10.00", closed: true,  ship_via: "TN", total: "210.00" },
            { id: "50",  invdate: "2015-10-31", name: "test5",  amount: "300.00", tax: "20.00", closed: false, ship_via: "FE", total: "320.00" },
            { id: "60",  invdate: "2015-09-06", name: "test6",  amount: "400.00", tax: "30.00", closed: false, ship_via: "FE", total: "430.00" },
            { id: "70",  invdate: "2015-10-04", name: "test7",  amount: "200.00", tax: "10.00", closed: true,  ship_via: "TN", total: "210.00" },
            { id: "80",  invdate: "2015-10-03", name: "test8",  amount: "300.00", tax: "20.00", closed: false, ship_via: "FE", total: "320.00" },
            { id: "90",  invdate: "2015-09-01", name: "test9",  amount: "400.00", tax: "30.00", closed: false, ship_via: "TN", total: "430.00" },
            { id: "100", invdate: "2015-09-08", name: "test10", amount: "500.00", tax: "30.00", closed: true,  ship_via: "TN", total: "530.00" },
            { id: "110", invdate: "2015-09-08", name: "test11", amount: "500.00", tax: "30.00", closed: false, ship_via: "FE", total: "530.00" },
            { id: "120", invdate: "2015-09-10", name: "test12", amount: "500.00", tax: "30.00", closed: false, ship_via: "FE", total: "530.00" }
        ],
        iconSet: "fontAwesome",
        idPrefix: "",
        rownumbers: true,
        sortname: "invdate",
        sortorder: "desc",
        threeStateSort: true,
        sortIconsBeforeText: true,
        headertitles: true,
        toppager: true,
        pager: true,
        rowNum: 5,
        viewrecords: true,
        searching: {
            defaultSearch: "cn"
        },
        caption: "The grid, which demonstrates formatters, templates and the pager"
    }).jqGrid("filterToolbar");
});

$('#btnGetAllIDs').click(function() {
    var idToDataIndex = $("#list").jqGrid('getGridParam','_index');
    var ids = Object.keys(idToDataIndex);
    console.log(ids);
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.2/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/css/ui.jqgrid.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.2/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/jquery.jqgrid.min.js"></script>
<div style="margin:5px;">
    <table id="list"></table>
    <button id="btnGetAllIDs">GetAllIDs</button>
</div>

但是,请同时阅读并推荐Oleg's answer,因为它具有可以执行此操作的条件和重要信息。

jqgrid版本<4.7的警告:

如果您要动态地从网格(delRowData)中删除行,则_index仍将具有已删除的行。您可以通过jqgrid.base.js中的fixing "refreshIndex"来解决此问题(就像4.7中一样)。