Get Index Row Clicked in jqGrid

Question

I want the value of a field in a row that the user Clicked. i Write this code but this code Is wrong.

var firstButtonColumnIndex = 0;
    grid = $('#list'), firstButtonColumnIndex, buttonNames = {};

grid.jqGrid({
    url: 'jQGridHandler.ashx',
    datatype: 'local',
    direction: "rtl",
    datatype: 'json',
    height: 250,
    colNames: ['', ''],
    colModel: [
        { name: 'WorkOrderNo', width: 100, sortable: true },
        { name: 'AssetNo', width: 150, sortable: true },
        { name: 'WorkDescription', width: 400, sortable: true },
        { name: 'WorkOrderDate', width: 100, sortable: true },
        { name: 'WorkOrderTime', width: 100, sortable: true },
        { name: 'Remark', width: 260, sortable: true },
        { name: 'del', width: 20, sortable: false, search: false,
            formatter: function () {
                return "<span class='ui-icon ui-icon-trash'></span>"
            }
        },
        { name: 'details', width: 20, sortable: false, search: false,
            formatter: function () {
                return "<span class='ui-icon ui-icon-document'></span>"
            }
        }
    ],
    gridview: true,
    rowNum: 10,
    rowList: [10, 20, 30],
    pager: '#pager',
    //  sortname: 'WorkOrderNo',
    viewrecords: true,
    sortorder: 'asc',
    rownumbers: true,
    beforeSelectRow: function (rowid, e) {
        var iCol = $.jgrid.getCellIndex(e.target);
        if (iCol >= 7) {
            alert("rowid=" + rowid + "\nButton name: " + buttonNames[iCol]);
        }
        // prevent row selection if one click on the button
        return (iCol >= firstButtonColumnIndex) ? false : true;
    }
});

buttonNames[7] = 'Remove';
buttonNames[8] = 'Details';
grid.jqGrid('navGrid', '#pager', { add: false, edit: false, del: false }, {}, {},
    {}, { multipleSearch: true, overlay: false, width: 460 });

but in beforeSelectRow event rowid Always 0. i want return WorkOrderNo row clicked.

plese help me. thanks all

Answer 1

First of all the code which you posted contains many small errors. So it can't work. If you modify your original code for the posting on the stackoverflow, please be more carefully in the modifications.

For example:

• colNames contains only two elements, but colModel - 8 elements. So one receive an error about the different length of the arrays and the code don't work more;
• You define datatype option twice: one with the value 'local' and one more time with the value 'json';
• You should use comma (',') instead of semicolon (';') as the end of firstButtonColumnIndex = 0 (see the first line). The current code use undefined grid and interpret it as the global variable.

To your main question:

You used "Get Index Row Clicked in jqGrid" as the title of your question, but you wrote in the text of your question that you have rowid always 0 and not rowIndex. To get the rowIndex you can modify the code of beforeSelectRow to the following:

beforeSelectRow: function (rowid, e) {
    var iCol = $.jgrid.getCellIndex(e.target);
    if (iCol >= 7) {
        alert("rowid=" + rowid +
              "\nrowIndex=" + $(e.target).closest("tr.jqgrow")[0].rowIndex +
              "\nButton name: " + buttonNames[iCol]);
    }
    // prevent row selection if one click on the button
    return (iCol >= firstButtonColumnIndex) ? false : true;
}

The information that you have always rowid as 0 follows to assumption that you fill wrong id in the JSON which produce the server code under 'jQGridHandler.ashx'. The id have to have unique values over the page. You can use Developer Tools to examine the id attribute of the rows (the ids of <tr> elements of the grid) or to use Fiddler of Firebug to catch the JSON which will be returned from the server. If you would have problem to localize the error you should append your question with the JSON data.