title: Programmatically Local Sorting on Server Data jqGrid
body: <p>I have a server-side data bound jqGrid. I just want local sorting when the sorting-button is clicked.</p>
  
  <p>I have done this:
  Just edited: getting full data and then sorting and inserting it in the grid.</p>
  
  <p><strong>Edited</strong></p>
  
  <pre><code>var asc = true;
  
  $(document).ready(function () {
  
      $("span.s-ico").click(function () {
  
          var allData = jQuery("#myGrid").jqGrid('getRowData');
      if (asc == true) {
          allData.sort(function (a, b) {
              if (a.myID&gt; b.myID) return -1;
              else return 1;
          });
          asc = false;
      }
      else {
          allData.sort(function (a, b) {
              if (a.myID&gt; b.myID) return 1;
              else return -1;
          });
          asc = true;
      }
  
      var alt = $.extend(true, [], allData);
  
      //alt.shift().shift();
      $('#myGrid').jqGrid('setGridParam', { url: null, datatype: 'local' });
      $('#myGrid').jqGrid('setGridParam', { data: alt });
      $('#myGrid').trigger("reloadGrid");
      return false;;
        //alert("I'm clicked");
      });
  
  });
  </code></pre>
  
  <p>on a jqGrid which is configured like this:</p>
  
  <pre><code>$("#myGrid").jqGrid({
          url: URL,
          datatype: 'json',
          mtype: req,
          ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
          colNames: ['AnotherColumn', 'myID'],
          colModel: [
                      { name: 'AnotherColumn', index: 'AnotherColumn', width: 105, sortable: false, editable: true },
                      { name: 'myID', index: 'myID', sortable: true, width: 185, editable: true }
                  ],
          rowNum: 100,
          rowList: [],      
          pgbuttons: false,
          pgtext: "Page {0} of {1}",
          pgtext: null,
          pager: '#myGridPager',
          sortname: 'myID',
          viewrecords: false,
          sortorder: 'asc',
          sortable: true
      });
  </code></pre>