title: Reload Grid not working for multiple jqgrid
body: <p>I am using jqgrid.  My page has three tabs and each tab contains a different grid.  All grids have different ids.  The content of tabs is fetched via AJAX request lazily.  Now after all three grids are rendered and I try to reload grid via function</p>
  <pre><code>jQuery(&quot;#myOffersTable&quot;).trigger('reloadGrid'); 
  </code></pre>
  <p>Only the grid which loaded last reloads and it doesn't work for other grids.</p>
  <p>For example, if grids load seq is :  1-2-3 then this code will only work for grid 3
  but if seq is 3-2-1 then it will work only for 1.</p>
  <p>But if I try reloading grids using reload button on navigator bar it works fine.</p>
  <h3>Update:</h3>
  <p>I am using Struts2 jQuery Plugin.It uses jqGrid 3.6.4
  I load json data using ajax.</p>
  <p>Below is the definition of my grid.</p>
  <pre><code>&lt;div id='t1'&gt;
      &lt;s:url id=&quot;offersurl&quot; action=&quot;offers&quot;/&gt;
       
      &lt;sjg:grid 
          id=&quot;offerstable&quot; 
          caption=&quot;Customer Examples&quot;
          autoencode=&quot;false&quot; 
          dataType=&quot;json&quot; 
          href=&quot;%{offersurl}&quot;         
          
          pager=&quot;true&quot;       
          navigator=&quot;true&quot;
          navigatorAdd=&quot;false&quot;
          navigatorDelete=&quot;false&quot;
          navigatorEdit=&quot;false&quot;
          navigatorSearch=&quot;false&quot;
                  
          gridModel=&quot;offers&quot;
          rowList=&quot;10,15,20&quot;
          rowNum=&quot;15&quot;
          rownumbers=&quot;true&quot;
          onCompleteTopics=&quot;addAcceptButtons&quot;
          filter=&quot;true&quot;
      &gt;
          &lt;sjg:gridColumn name=&quot;id&quot; index=&quot;id&quot; title=&quot;ID&quot; formatter=&quot;integer&quot; sortable=&quot;false&quot; search=&quot;false&quot;/&gt;
          &lt;sjg:gridColumn name=&quot;offeror&quot; index=&quot;offeror&quot; title=&quot;Offeror&quot; sortable=&quot;true&quot; search=&quot;false&quot;/&gt;
          &lt;sjg:gridColumn name=&quot;itemOffered&quot; index=&quot;itemOffered&quot; title=&quot;ItemOffered&quot; sortable=&quot;false&quot; search=&quot;true&quot; searchoptions=&quot;{sopt:['eq']}&quot;/&gt;
          &lt;sjg:gridColumn name=&quot;quantityOffered&quot; index=&quot;quantityOffered&quot; title=&quot;QuantityOffered&quot; sortable=&quot;false&quot; search=&quot;true&quot; searchoptions=&quot;{sopt:['eq','lt','gt']}&quot;/&gt;
          &lt;sjg:gridColumn name=&quot;expectedItem&quot; index=&quot;expectedItem&quot; title=&quot;ExpectedItem&quot; sortable=&quot;false&quot; search=&quot;true&quot; searchoptions=&quot;{sopt:['eq']}&quot;/&gt;
          &lt;sjg:gridColumn name=&quot;expectedQuantity&quot; index=&quot;expectedQuantity&quot; title=&quot;ExpectedQuantity&quot; sortable=&quot;false&quot; search=&quot;true&quot; searchoptions=&quot;{sopt:['eq','lt','gt']}&quot;/&gt;
          &lt;sjg:gridColumn name=&quot;acceptOffer&quot; index=&quot;acceptOffer&quot;  title=&quot;Accept Offer&quot; search=&quot;false&quot;/&gt;
      &lt;/sjg:grid&gt;    
      
  &lt;/div&gt;
  </code></pre>
  <p>I have three such grids all have different ids and all that stuff.</p>
  <p>There is a search button above each grid which calls the following function with parameter sel.sel is 1,2 or 3 corresponding to each grid</p>
  <pre><code>function search(sel)
  {   
      alert(&quot;search&quot;);
      if(sel==1)
      {       
          tradeOffer = $(&quot;#games&quot;).val();
          var srchValue = $(&quot;#srchoptions&quot;).val();
              $.ajaxSetup({
                  data: {'gameId': tradeOffer},             
              });
          jQuery(&quot;#offerstable&quot;).jqGrid('setGridParam',{url:&quot;offers.action?q=1&amp;srch=&quot;+srchValue,page:1});
          //jQuery(&quot;#offerstable&quot;).trigger('reloadGrid');
          $(&quot;#offerstable&quot;).trigger(&quot;reloadGrid&quot;);
      }
      else if(sel==2)
      {           
              myTradeOfferGame = $(&quot;#my&quot;).val();          
                  $.ajaxSetup({
                      data: {'gameId': myTradeOffer},               
                  });
              jQuery(&quot;#myOffersTable&quot;).jqGrid('setGridParam',{url:&quot;offers.action?q=1&quot;,page:1});
              jQuery(&quot;#myOffersTable&quot;).trigger('reloadGrid');                 
      }
      else if(sel==3)
      {           
              acceptedTradeOfferGame = $(&quot;#accepted&quot;).val();          
                  $.ajaxSetup({
                      data: {'gameId': acceptedTradeOffer},             
                  });
              jQuery(&quot;#acceptedtable&quot;).jqGrid('setGridParam',{url:&quot;offers.action?q=1&quot;,page:1});
              jQuery(&quot;#acceptedtable&quot;).trigger('reloadGrid');                 
      }
      
  }
  </code></pre>
  <p>The function gets called for each grid but</p>
  <pre><code>jQuery(&quot;#acceptedtable&quot;).trigger('reloadGrid'); 
  </code></pre>
  <p>works for only grid loaded last.</p>