Sorting not working in Jqgrid after using a custom formatter

Question

I'm using jqgrid with datatype as json and value retrieving from another url,

     colModel: [
    { name: "Details", width: 200,classes: 'pointer wrap',sortable: false,
         formatter: function myFormatter(cellvalue, options, rowObject){
         number=rowObject.properties.number;
         name= rowObject.properties.shortName;
          fullDetails= '<strong> '+name+ '</strong> </br>[<a id="pointer"  title="Click to  search" href= http://google.com/search?search='+number+' target='+number+'>'+number+'</a>]';
         return fullDetails;

         }
        },
   { name:"name",jsonmap: "properties.shortName", width: 200,classes: 'pointer wrap',hidden:true},
    {name:"number", jsonmap: "properties.number", width: 50 ,sortable: true,hidden:true},
    { name:"date",jsonmap: "properties.date", width: 80,hidden :false}

 ],
    pager: "#pager",
    //rowNum: 20,
    rowNum: 100,
    rowList: [10, 20, 30],
    sortname: "matter",
    sortorder: 'asc',
    viewrecords: true,
    gridview: true,
    loadonce : true,
    autoencode: true,
    height:'auto',
    hidegrid: false,

    caption: "Details",
    jsonReader : {
        repeatitems: false,

        root: "properties"

       }

Loading works fine But after clicking the column header to sort it

TypeError: rowObject.properties is undefined number=rowObject.properties.number; is shown What could have possibly gone wrong ? What could be the fix ? Below given is the sample data

             [
                {"properties":
                   {"date":1409327760,"name":"agent M","number":"4117859","shortName":"AM"},"children":null,"valId":"225","objectType":"VAL"},
                {"properties":
                    {"date":14093278860,"name":"agent x","number":"97893783","shortName":"AX"},"children":null,"valId":"191","objectType":"VAL"}
        ]

Answer 1

You should don't use column names like name: "properties.number" and so on. You should look at the value of name property like on the value which will be used as the name of variable (or the name of the property) and the part of the value of id attribute.

The line jQuery("#list").jqGrid('setGridParam',{datatype:'local'}); inside of loadComplete is typically an error. If you load the data from the server and uses datatype: "json" then you should use loadonce: true instead.

You don't posted datatype which you used and don't posted an example (2 rows of input data would be enough) of input data. The value repeatitems: true of jsonReader seems suspected. Nevertheless I could suppose that you can use jsonmap attribute for reading of original data (returned from the server):

{ name: "number", jsonmap: "properties.number", width: 50, hidden: true}

See the demo.