title: JQGrid getGridParam data returns empty array
body: <p>In a custom button in my pager, I call <code>grid.jqGrid("getGridParam", "data"), "data")</code> to get all the data in the grid but it returns empty array. When I call <code>grid.jqGrid("getGridParam", "data")</code> in the loadComplete function, it still returns an empty array. However if I call <code>grid.jqGrid('getRowData')</code> it gives me the data I am looking for. See my code below.</p>
  
  <pre><code>&lt;%@ page language="java" contentType="text/html; charset=ISO-8859-1"
           pageEncoding="ISO-8859-1" %&gt;
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;
      &lt;link rel="stylesheet" type="text/css" media="screen" href="${pageContext.request.contextPath}/css/jquery-ui.min.css"/&gt;
      &lt;link rel="stylesheet" type="text/css" media="screen" href="${pageContext.request.contextPath}/css/ui.jqgrid.css"/&gt;
      &lt;!--   Overide css styling to ensure that calendar image is inline with text box --&gt;
      &lt;style type="text/css"&gt;.ui-jqgrid .ui-search-table .ui-search-input &gt; input,
                              .ui-jqgrid .ui-search-table .ui-search-input &gt; select,
                              .ui-jqgrid .ui-search-table .ui-search-input &gt; img {vertical-align: middle; display: inline-block;}
      &lt;/style&gt;
      &lt;script src="${pageContext.request.contextPath}/js/jquery-1.11.0.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="${pageContext.request.contextPath}/js/jquery-ui.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="${pageContext.request.contextPath}/js/grid.locale-en.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="${pageContext.request.contextPath}/js/jquery.jqGrid.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;title&gt;Trucks Overview&lt;/title&gt;
  
      &lt;script type="text/javascript"&gt;
      jQuery().ready(function () {
          var grid = jQuery("#truck_grid");
          var orderGridDialog = $('#truck_grid_dialog');  
          var gridData;
  
          getUniqueNames = function(columnName) {
              var texts = grid.jqGrid('getCol', columnName, false);
              var uniqueTexts = [], textsLength = texts.length, text, i, textsMap = {}; 
              for (i=0;i&lt;textsLength;i++) {
                  text = texts[i];
                  if (text != undefined &amp;&amp; textsMap[text] === undefined) {
                      // to test whether the texts is unique we place it in the map.
                      textsMap[text] = true;
                      uniqueTexts.push(text);
                  }
              }
              return uniqueTexts;
          };
          buildSearchSelect = function(uniqueNames) {
              var values=":All";
              $.each (uniqueNames, function() {
                  values += ";" + this + ":" + this;
              });
              return values;
          };
          setSearchSelect = function(columnName) {
              grid.jqGrid('setColProp', columnName,
                          {   stype: 'select',
                              searchoptions: {
                                  value:buildSearchSelect(getUniqueNames(columnName)),
                                  sopt:['eq']
                              }
                          }
              );
          };
  
          var initDateWithButton = function (elem) {
              if (/^\d+%$/.test(elem.style.width)) {
                  // remove % from the searching toolbar
                  elem.style.width = '';
              }
              // to be able to use 'showOn' option of datepicker in advance searching dialog
              // or in the editing we have to use setTimeout
              setTimeout(function () {
                  $(elem).datepicker({
                      dateFormat: 'mm/dd/yy',
                      showOn: 'button',
                      changeYear: true,
                      changeMonth: true,     
                      buttonImageOnly: true,
                      buttonImage: "images/calendar.gif",
                      buttonText: "Select date",
                      showButtonPanel: true,
                      onSelect: function (dateText, inst) {
                          inst.input.focus();
                          if (typeof (inst.id) === "string" &amp;&amp; inst.id.substr(0, 3) === "gs_") {
                               $(inst.id).val(dateText);
                               grid[0].triggerToolbar();
                          }
                          else {
                              // to refresh the filter
                              $(inst).trigger("change");
                          }
                      }
                  });
              }, 100);
          };
  
          grid.jqGrid({
              url: '${pageContext.request.contextPath}/getTrucksJSONAction',
              datatype: "json",
              mtype: 'GET',
              colNames: ['Truck ID', 'Status', 'Carrier Code', 'Date Created', 'Date Closed', 'T1 Status', 'Truck Arrived'],
              colModel: [
                  {name: 'truckId', key:true, index: 'truckId', align: 'center', width: 100},
                  {name: 'status', index: 'status', align: 'center', width: 100},
                  {name: 'carrierName', index: 'carrierName', align: 'center', width: 100},
                  {name: 'createdDate', index: 'createdDate', align: 'center', width: 100},
                  {name: 'closedDate',  index: 'closedDate', align: 'center', width: 100},
                  {name: 't1Status', sortable: false, align: 'center', width: 100, fixed: true,
                      formatter: function (celvalue) {
                          return celvalue ?
                              "&lt;img src='http://www.clker.com/cliparts/q/j/I/0/8/d/green-circle-icon-md.png' alt='green light' style='width:15px;height:15px'/&gt;" :
                              "&lt;img src='http://www.iconsdb.com/icons/preview/red/circle-xxl.png' alt='red light' style='width:10px;height:10px'/&gt;";
                      }} ,
                  {name: 'truckArrived', sortable: false, align: 'center', width: 100, fixed: true,
                          formatter: function (celvalue) {
                              return celvalue ?
                                  "&lt;img src='http://www.clker.com/cliparts/q/j/I/0/8/d/green-circle-icon-md.png' alt='green light' style='width:15px;height:15px'/&gt;" :
                                  "&lt;img src='http://www.iconsdb.com/icons/preview/red/circle-xxl.png' alt='red light' style='width:10px;height:10px'/&gt;";
                          }}    
              ],
              rowNum: 10,
              height: 300,
              autoheight: true,
              autowidth: true,
              rowList: [10, 20, 30],
              pager: jQuery('#truck_grid_pager'),
              sortname: 'truckId',
              sortorder: "desc",
              jsonReader: {
                  root: "records",
                  page: "page",
                  total: "total",
                  records: "rows",
                  repeatitems: false
              },
              viewrecords: true,
              altRows: false,
              gridview: true,
              hidegrid: false,
              multiselect:true,
              recordtext: '',
              emptyrecords: 'No Trucks',
              forceFit: true,
              caption: "Trucks Overview",
              loadComplete: function() { 
                  // Reload the grid after changing paginattion
                  var allRecords = grid.getGridParam('lastpage') * grid.getGridParam('records');
                  grid.jqGrid('setGridParam', { 
                      recordtext: allRecords + ' Trucks(s) Found. Displaying {0} to {1}'});   
                  $(this).trigger("reloadGrid");
                  async: false,
                  setSearchSelect('status');
                  setSearchSelect('carrierName');
                  grid.jqGrid('setColProp', 'truckId', {
                      searchoptions : {
                          sopt : [ 'bw' ],
                          dataInit : function(elem) {
                             $(elem).autocomplete({
                                source : getUniqueNames('truckId'),
                                delay : 0,
                                minLength : 0
                             });
                         }
                      }
                  });   
                  grid.jqGrid('setColProp', 'createdDate', {
                      sorttype: 'date', editable: true,
                          editoptions: { dataInit: initDateWithButton, size: 8 },
                          searchoptions: {
                              sopt: ['eq', 'ne', 'lt', 'le', 'gt', 'ge'],
                              dataInit: initDateWithButton
                          }
                  });   
                  gridData = $(this).jqGrid("getGridParam", "data");
                  grid.jqGrid('filterToolbar', {autoSearch: true});
              },
          }).navGrid('#truck_grid_pager', {edit: false, add: false, del: false, search: false, refresh: true})
          .navButtonAdd('#truck_grid_pager', {caption:"Truck Arrived", buttonicon:"ui-icon-flag",  position:"first", title:"Truck Arrived",
              onClickButton: function(){ 
                  var i;
                  var data = grid.jqGrid("getGridParam", "data");
                  var selRowIds = grid.jqGrid('getGridParam', 'selarrrow');
                  for (i = 0; i &lt; data.length; i++) {
                      if (selRowIds.indexOf(data[i].truckId) &gt; -1) {
                          data[i].truckArrived = true;
                      }
                  }
                  grid.trigger("reloadGrid");
               }
          })
          .navButtonAdd('#truck_grid_pager', {caption:"Ship Confirm", buttonicon:"ui-icon-circle-check",  position:"first", title:"Ship Confirm",
              onClickButton: function(){ 
               alert("Ship has been confirmed");}
          });
  
          orderGridDialog.dialog({
              autoOpen: false,
              width: 1000,
              height: 400,
              draggable: false,
              show: {
                  effect: "blind",
                  duration: 500
              },
              hide: {
                  effect: "blind",
                  duration: 250
              },
              close: function(event, ui){
                  orderGridDialog.text('Loading Grid...');
              }
          });
      });
  
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;table id="truck_grid"&gt;&lt;/table&gt;
  &lt;div id="truck_grid_pager"&gt;&lt;/div&gt;
  &lt;div id="truck_grid_dialog" title="Orders Overview"&gt;Loading...&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  
  
  The problem happens in the last section of the code, namely:
  
          .navButtonAdd('#truck_grid_pager', {caption:"Truck Arrived", buttonicon:"ui-icon-flag",  position:"first", title:"Truck Arrived",
              onClickButton: function(){ 
                  var i;
                  var data = grid.jqGrid("getGridParam", "data");
                  var selRowIds = grid.jqGrid('getGridParam', 'selarrrow');
                  for (i = 0; i &lt; data.length; i++) {
                      if (selRowIds.indexOf(data[i].truckId) &gt; -1) {
                          data[i].truckArrived = true;
                      }
                  }
                  grid.trigger("reloadGrid");
               }
          })
  </code></pre>
  
  <p>The second problem I have is when <code>grid.trigger("reloadGrid")</code> is called, the truckArrived icon is not changed from red to green as expected.</p>