jqGrid with Custom sorttype

I am using jqGrid 3.7.2 with local data. For some columns the default sorttypes are not sufficient. I need to provide a custom sorttype, which I understand from the documentation is possible. I don't know how to get it to work though. The code below is my best attempt at getting it to work - I can't make it call the custom sorting function though. The idea is to sort the 'Posn' field in the order 'GK'->'DEF'->'MID'->'STR'. Here is the code I'd like to get working:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <title>Table Testbed</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/south-street/jquery-ui.css">
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

  <link rel="stylesheet" type="text/css" href="/thirdParty/jqGrid/ui.jqgrid.css" >
  <script type="text/javascript" src="/thirdParty/jqGrid/grid.locale-en.js"></script>
  <script type="text/javascript" src="/thirdParty/jqGrid/jquery.jqGrid.min.js"></script>

  <script type="text/javascript">
  $().ready(function()
  {
   tableToGrid("#playerTable",
   {
    datatype:  "local",
    sortable:  true,
    hidegrid:  false,
    multiselect:  false,
    altRows:  true,
    height:   "100%", 
    width:   "155px",
    shrinkToFit: true,
    rowNum: 100,
    colNames:  ['Posn','Name'],
    colModel: [
     {name:'Posn', index:'Posn', width:100, sorttype:
      function(cell)
      {
       if (cell=='GK') return '0';
       if (cell=='DEF') return '1';
       if (cell=='MID') return '2';
       if (cell=='STR') return '3';
      }
     },
     {name:'Name', index:'Name', width:200, sorttype:"text"}
    ]
   });
  });
  </script>
 </head>

 <body>
  <table id="playerTable"> 
   <thead> 
    <tr><th>Posn</th><th>Name</th></tr> 
   </thead> 
   <tbody> 
    <tr><td>GK</td><td>Almunia</td></tr> 
    <tr><td>GK</td><td>Fabianski</td></tr> 
    <tr><td>DEF</td><td>Campbell</td></tr> 
    <tr><td>DEF</td><td>Clichy</td></tr> 
    <tr><td>MID</td><td>Denilson</td></tr> 
    <tr><td>MID</td><td>Diaby</td></tr> 
    <tr><td>STR</td><td>Arshavin</td></tr> 
    <tr><td>STR</td><td>Bendtner</td></tr> 
   </tbody> 
  </table> 
 </body>
</html>

Solution 1:

Probably you read about the usage of sorttype as a function in Tony's answer to my thread http://www.trirand.com/blog/?page_id=393/help/custom-local-sort-with-respect-of-the-function-as-index/. Your problem could be very easy solved. My suggestion to use index as a function for custom sorting of local jqGrid data work fine in the version 3.7.1, but not more in the version 3.7.2 of jqGrid. The feature sorttype as a function is implemented in the jqGrid after the release of the version 3.7.2.

So to be able to use sorttype as a function you have to download the latest version of jqGrid from http://github.com/tonytomov/jqGrid/tree/master. This is an uncompressed version of jqGrid. If you not familier with uncompressed version of jqGrid I'll recommend you to read http://www.trirand.com/jqgridwiki/doku.php?id=wiki:how_to_install#development_installation to undertand which of js files and in the which order you should include. Under http://www.ok-soft-gmbh.com/jqGrid/CustomSorttype1.htm you can find a working example of your code where the custom function really work.

Solution 2:

According to this forum post, a custom sorttype is only called when the grid is initialized and not during the onSortCol event:

As I understand it right now, if I have a custom sorttype like sorttype:sortDate, the function sortDate will only be called when jqGrid is initialized and not the event onSortCol. Is the only way to make onSortcol call SortDate is by manually over riding onSortCol event and writing the tedious code that does this and updates the grid accordingly? Why doesn't defining the sorttype:sortDate just over ride onSortCol event automatically? I mean when the jqGrid gets initailized it sorts correctly, but when I call the event it must do some built in sort. Why I ask is because my sortDate function doesn't have any code that actually updates jqGrid. it just returns 1,-1, or 0. its used in something outside of jqGrid…

Does this explain the behavior you are seeing?

jqGrid with Custom sorttype

Solution 1:

Solution 2:

Related

Recent Posts