Get all row IDs in jqGrid

Question

How can one get the ID's of every row in a grid, even across pages?

getDataIDs and getRowData only gives the ID's of the current page.

Thanks!

Answer 1

It is possible only if you have local grid (datatype:'local' or having loadonce:true). In the case all data inclusive ids for all pages are already locally. In the case you can use _index parameter, which will be used typically together with another more known parameter data. With

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

you will get the _index parameter. It is an object which has as the properties all ids of grid. So you can enumerate the ids with

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');
    }
}

Answer 2

In later versions of jqGrid they came out with a function that suits this situation better as it will consider any toolbar filtering that may be in place. See Oleg's example here. Thus, if you have a jqGrid (loadonce:true and/or datatype:local) the following will return all row ids (displayed in current page and beyond) which match the current filtering.

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

This returns a plain array, unlike the original answer, which returns an object with properties that must be enumerated.

Answer 3

There is another way of getting this data in older versions on jqgrid:

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

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

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

Answer 4

Considering that Object.keys is supported since IE9, if you only need the IDs, nowadays I would use:

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>

But please also read and upvote Oleg's answer because it has the conditions in which it's possible to do this and the important information.

Warning for jqgrid version < 4.7:

If you are dynamically removing rows from the grid (delRowData), the _index will still have the deleted rows. You may fix that by fixing "refreshIndex" in jqgrid.base.js (as they did in 4.7).