How do you retrieve selected cell value in jqGrid?

Question

With the code below, it displays the cell value that was last selected. How do I display the cell value of the row I just clicked on?

jQuery('#grid').click( function() {
  var grid = jQuery('#grid);
  var sel_id = grid.jqGrid('getGridParam', 'selrow');
  var myCellData = grid.jqGrid('getCell', sel_id, 'source_id');
  $('#selrow').html("Source ID selected:" + myCellData);
});

score 2 · Accepted Answer · edited May 23 '17 at 11:55

You code is a little strange because you use jQuery binding to click instead of the usage of events like onCellSelect. If you use this you should use the first parameter of the click function, for example e (jQuery('#grid').click(function(e) {...});). The e.target is the DOM element of the cell (<td>) or an element inside of cell (like <a> inside of <td>) which the user clicked. The code $(e.target).closest("td") will gives you the cell.

If you do decide to use onCellSelect I would recommend you to read the answer with the demo.

score 1 · Answer 2 · answered May 19 '11 at 22:01

When setting up the grid, you can define a callback function for the onCellSelect event.

e.g:

var grid = jQuery('#grid').jqGrid( {
 ... default grid setup ...,
 onCellSelect: function(rowid, icol, cellcontent, e) { alert(cellcontent); },
 });

A list of all the jqGrid events is here: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:events

How do you retrieve selected cell value in jqGrid?

2 Answers2