title: jqGrid get row data on custom button click
body: <p>I have following custom grid</p>
  
  <p><a href="https://i.stack.imgur.com/A9A2T.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/A9A2Tm.jpg" alt="grid screenshot"></a></p>
  
  <p>I need to get <code>rowObject</code> when user clicks the image in Serial column to show a dialog allowing user to select another serial from available list for that row and then send the selected serial back to server.</p>
  
  <p>As the images on column 5 and 6 execute functions related to data in their column, I cannot combine all images to a single action column with edit and delete buttons thus <a href="https://stackoverflow.com/q/43520014"><strong>this answer</strong></a> is not suitable for me.</p>
  
  <p>Currently I'm using following method to find desired row and call my function with row data. This method is slow as it has to go through data in a for loop and find the matching record. I stripped out all unrelated code and here is the rest</p>
  
  <pre><code>    var TerminalColNames = [
          'id',
          'Serial'
      ];
  
      var TerminalColModel = [
          { name: 'id', width: '180px', formatter: TerminalID_Formatter},
          { name: 'serial', width: '160px', formatter: Formatter, sortable: false }
      ];
  
      function TerminalID_Formatter(cellvalue, options, rowObject) {
          return ' ' +
              '&lt;img src="pencil.png" onclick="return edit(\'' + cellvalue + '\')"&gt; ' +
              '&lt;img src="bin.png"    onclick="return delete(\'' + cellvalue + '\')"&gt; ' +
              cellvalue;
      }
  
      function Formatter(cellvalue, options, rowObject) {
          return '&lt;img src="link.png" onclick="return bind(\'' + rowObject.id + '\')"&gt;&lt;/a&gt; ' + rowObject.serial.current;
      }
  
      function CreateGrid(TableElement, colNames, colModel, data) {
  
          $(TableElement).jqGrid({
              datatype: 'local',
              data: data,
              colNames: colNames,
              colModel: colModel,
              height: '150px',
              //onSelectRow: function (id, status, e) {
              //    rowData = $(this).jqGrid("getLocalRow", id);
              //    return RowAction(rowData);
              //}
          });
      }
  
      $(function () {
          CreateGrid('#TerminalGrid', TerminalColNames, TerminalColModel, data.terminals);
      });
  
      function RowAction(rowData) {
          alert('Row Action:' + JSON.stringify(rowData));
      }
  
      function bind(id) {
          for (i in data.terminals){
              if (data.terminals[i].id == id){
                  return ProcessBind(data.terminals[i]);
              }
          }
          return false;
      }
  
  
      function ProcessBind(rowObject){
          if (rowObject.id)
              alert('Bind:' + rowObject.serial.avail.length);
          else 
              alert('Bind not found');
          return true;
      }
  
      var data = {
          "id": "1234",
          "terminals": [
              {
                  "id": "111111",
                  "serial": {
                      "current": "888888",
                      "avail": [
                          "444444",
                          "555555",
                          "666666"
                      ]
                  }
              },
              {
                  "id": "777777",
                  "serial": {
                      "current": "333333",
                      "avail": [
                          "999999",
                          "000000",
                      ]
                  }
              },
              //.....
          ]
          //.....
      }
  </code></pre>
  
  <p>I didn't use <code>$(this).closest('tr').attr('id')</code> because I believe it is much slower as it has to go through DOM to find the id and then go through the JSON data to find the row data. It also needs <code>key: true</code> to be set in id column.</p>
  
  <p><strong>Question</strong></p>
  
  <p>Is there a better method to get the record data?
  Or is there a jqGrid method to return rowIndex in JSON array?</p>
  
  <p><strong>EDIT</strong>
  I forget to mention that I'm using <a href="https://github.com/free-jqgrid/jqGrid" rel="nofollow noreferrer">oleg's free jqgrid 4.15.2</a></p>