Search code examples
javascriptjqgriddate-sorting

jqGrid date sort (local) doesn't work


I know there are a bunch of answers to this kind of issue here, but they all seemed to have some unique circumstances. In my case however, it should be a very straightforward thing because I'm not doing anything weird with the dates, yet I can't get date sorting to work.

Here's the data I get from JSON (partially redacted, as this is a company project).

{"rows": [
    {"cell": [ "140935", ..., "19/06/2013 3:17:02 PM", ... ]},
    {"cell": [ "140894", ..., "19/06/2013 10:01:57 AM", ... ]},
    {"cell": [ "140803", ..., "18/06/2013 11:50:01 AM", ... ]},
    {"cell": [ "140008", ..., "10/06/2013 12:44:44 PM", ... ]},
    {"cell": [ "138280", ..., "28/05/2013 11:57:19 AM", ... ]},
    {"cell": [ "118286", ..., "15/11/2012 7:13:19 PM", ... ]}
]}

So as you can see, when I get it from the server it's already sorted. Trouble is, when I use sort in the table it gets screwed up and the 28/5/2013 date gets put in "later" than the June dates. Here's the screenshto. May date ends up "later" than June date

And here is the jqGrid code I use to generate this (I partially redacted it for brevity, but I don't think I removed anything that would affect this issue).

I set up the column names and column model as variables first to keep things neat.

cnames = ['ID', _company, _location, ... _createdon..],
cmodel = [
    { name:'ticketId', index:'ticketId', key:true, width:60, align:'center',
        sorttype:'int', fixed:true, resizable:false, editrules:{ edithidden:true }
    },
    { name:'company', index:'company', width:117, editrules:{edithidden:true} },
    { name:'location', index:'location', width:94, editrules:{edithidden:true} },
    ...
    { name:'CreatedOn', index:'CreatedOn', width:85, sorttype:'date',
        datefmt:'m/d/Y h:i:s A', fixed:true, editrules:{edithidden:true, date:true} },
    ...
]

So the date format m/d/Y h:i:s A matches the date data I get from server 15/11/2012 7:13:19 PM.

I then load jqGrid like this

ticketsTable = tableWrap.jqGrid({
    url:            urlTicketHandler + '?method=GetTickets&' + filtersData,
    mtype:          'GET',
    datatype:       'json',
    colNames:       cnames,
    colModel:       cmodel,
    height:         'auto',
    rowNum:         1000,
    autowidth:      true,
    sortname:       'priority',
    sortorder:      'desc',
    pgbuttons:      false,
    pginput:        false,
    pgtext:         '',
    viewrecords:    true,
    altRows:        true,
    loadonce:       true,
    scrollOffset:   0,
    hidegrid:       false,
    caption:        _tickets,
    toppager:       true,
    pager:          '#ticketsList_footer',
    prmNames:       {page:null, rows:null, search:null},
    viewsortcols:   [true,'vertical',true],
    recordtext:     _showingxt + ' {2} ' + _tickets,
    gridview:       true,
    ignoreCase:     true,
    multiselect:    hasFullAccess,
    loadComplete:   function(d) {
        if (firstLoad) {
            firstLoad = false;
            if (isColState && myColumnsState.permutation.length) {
                $(this).jqGrid("remapColumns", myColumnsState.permutation, true);
            }
        }
        saveColumnState.call($(this), this.p.remapColumns);
    }
});

The only thing here that I think might cause any issues is the column saving part (I didn't include the whole function here but I'm not sure it's actually relevant and I took it from jqGrid's own site).

I omitted some formatting I do on other columns but I don't touch the date column. I also omitted some functions to add custom buttons to the table, but again, I don't think it matters.

Anything I'm missing here?


Solution

  • I lost count of the number of times I've gone over this trying to figure out what the heck was going on. Naturally, abiding by Murphy's Law it wasn't until I posted it on Stackoverflow that I finally saw my really simple, really embarrassing mistake in writing the date format. Of course now it's out there, in public, on the interwebs, to forever display my shame for all to see. There's nothing left to say sigh