Traversing through jQgrid and find row id when click - html

Question

I am traversing through jqGrid. When I press row action button it should get current pressed row data, to do this I need to get row id of that row when clicked.
<tr role="row" id="1" tabindex="-1" class="jqgrow ui-row-ltr ui-widget-content">
This is closest tr and I can reach till this tr easily using below code.
$("#rangemaster").children("tr.jqgrow")
But when I try to get id its showing undefined.
$("#rangemaster").children("tr.jqgrow").attr("id")
I want to pic id value of that tr.jqgrow.

Answer 1

You can find tr with class name and catch your attribute id using jQuery object $(this).
$("#grid").find("tr.jqgrow").each(function(index) {
console.log(index + ": " + $(this).attr("id"));
});
Example:
var mydata = [{
id: "1",
label: "No 1",
number: "123",
status: "OPEN",
},
{
id: "6",
label: "No 2a",
number: "222",
status: "Close"
}
];
var grid = $("#grid");
grid.jqGrid({
datatype: "local",
colNames: ['Col-Id', 'Col-Label', 'Col-Number', 'Col-Status'],
colModel: [{
name: 'id',
index: 'id',
width: 60,
sorttype: "int"
},
{
name: 'label',
index: 'label',
width: 180,
sorttype: "string"
},
{
name: 'number',
index: 'number',
width: 120,
sorttype: "float"
},
{
name: 'status',
index: 'status',
width: 120,
sorttype: "string"
}
],
gridview: true,
sortname: 'id',
treeGrid: true,
treedatatype: 'local',
height: 'auto',
pager: "#gridPager"
});
grid[0].addJSONData({
total: 1,
page: 1,
records: mydata.length,
rows: mydata
});
$("#grid").find("tr.jqgrow").each(function(index) {
console.log(index + ": " + $(this).attr("id"));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/5.8.0/css/ui.jqgrid.min.css">
<script type="text/javascript" charset="utf8" src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/5.8.0/js/jquery.jqGrid.min.js"></script>
<table id="grid"></table>
<div id="gridPager"></div>