title: Refreshing a jqgrid on a menu item click, getting data from a different URL
body: <p>This is a followup to my earlier question posted <a href="https://stackoverflow.com/questions/13765715/trouble-to-displaying-json-data-on-jqgrid-and-formatting">here</a>. I have my grid showing up correctly now, thanks to the answer by Oleg. However, now I need to refresh the data in the jqgrid with a different URL on a bootstrap menu item click. Following is my code:</p>
  
  <pre><code>$("#menuitem").click(function(e){
  $("#grid").jqGrid('setGridParam', {url: '/getdata?id=1234&amp;name=val.text'});
      $('#grid').trigger("reloadGrid");
  });
  </code></pre>
  
  <p>The menu options are added dynamically after we get data from a ajax request. The grid seems to reloading when the reload is triggered. However, it seems to get data from the old URL('/getdata') and not the new one with a different parameter set. I also tried the solution mentioned <a href="https://stackoverflow.com/questions/1297044/reload-a-loaded-jqgrid-with-a-different-table-data">here</a>, but it did not work in my case as I have dynamically added menu items.</p>
  
  <p>Any help is greatly appreciated.</p>
  
  <p>EDIT: I looked at the page request on firebug. I do not see a request going when I click on the menu item. I also added </p>
  
  <pre><code> $("#list").jqGrid('GridUnload'); 
  </code></pre>
  
  <p>to the click handler function as mentioned in the answer to <a href="https://stackoverflow.com/questions/2475379/update-data-in-jqgrid?rq=1">this</a> question. It cleared out the grid for me, but did not reload. So I added the code for jqgrid there and then it worked and the jqgrid displays with the new data. So my code with the changes looks like this:</p>
  
  <pre><code>$("#menuitem").click(function(e){
      $("#list").jqGrid('GridUnload'); 
      $("#grid").jqGrid({
         url: '/getdata?id=1234&amp;name=val.text'',
         datatype: "json",
         colNames: ['data'],
         colModel: [
              {name: 'data', align: 'center'}
         ],
         jsonReader: {
               root: "logs",
              cell: "",
             id: function () {
               return function () {
                 return $.jgrid.randId();
               }
             },
         page: function() { return 1; },
         total: function() { return 1; },
         records: function(obj) { return obj.logs.length; }
      },
     loadonce: true,
     viewrecords: true,
     autowidth: true,
     ignoreCase: true,
     height: "auto",
     rowNum: 999,
     autoencode: true,
     beforeProcessing: function (data) {
         var items = data.data.data.split("\n"), i, l, item;
         data.logs = [];
         for (i = 0, l = items.length; i &lt; l; i++) {
             item = $.trim(items[i]);
             if (item.length &gt; 0) {
                 data.logs.push([item]);
             }
     }
  }
  }).jqGrid('filterToolbar', {stringResult: true, searchOnEnter: false, defaultSearch: "cn"}); 
  </code></pre>
  
  <p>});</p>
  
  <p>Is there a better way to do this. It looks too cumbersome and heavy for what its doing. Is there a way to get the reload grid to work? I guess this is what goes on internally, but seems too much code when you using the plugin.</p>
  
  <p>thanks,</p>
  
  <p>Asha</p>