jQuery Grid Plugin - jqGrid - Topic: Date Sorting in local table. http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table Simple:Press Version 5.7.5.3 senrajsurendran on Date Sorting in local table. http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table#p25522 Help http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table#p25522 thanks a lot..... I have faced the same difficulty..... Thats fixed after following ur suggestion....... 🙂

Smile

]]> Fri, 23 Dec 2011 07:37:49 +0200 cjm19682 on Date Sorting in local table. http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table#p16233 Help http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table#p16233 Brilliant, thanks for your help. Works OK as follows:

$("#MarkupTable").jqGrid('setColProp','Date',{sorttype:'date', formatter:'date', datefmt: 'd-m-y'});

A few observations that might help others:

  • I do notice that the date handling is quite fussy when datatype is "clientSide". When row content comes from HTML markup (using tableToGrid), the datefmt doesn't get used for actual formatting - that gets taken from the HTML markup, but the datefmt property is still required to make the sorting work.
  • Similarly, if data is imported in JSON using the 'addRowData' function, the formatting seems to be determined by the value of newformat in the localisation file e.g. grid-locale-en.js
  • The demos all seem to have dates formatted as Y-m-d, which will sort correctly as string-text, so I think the date-format demo code is often incorrect and the data is only correctly sorted because the text sorting produces the same results as date sorting for the given data and configuration parameters. Definitely worth changing example formatting as this is the only way to illustrate the code working correctly.
]]> Mon, 05 Apr 2010 01:36:51 +0300 tony on Date Sorting in local table. http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table#p16117 Help http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table#p16117 Hello,

Use the datefmt option in colModel

http://www.trirand.com/jqgridw.....el_options

Best Regards

Tony

]]> Wed, 31 Mar 2010 19:56:27 +0300 cjm19682 on Date Sorting in local table. http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table#p16015 Help http://www.trirand.com/blog/?page_id=393/help/date-sorting-in-local-table#p16015 I have a date sorting problem I can't work around. I can't make date formatting and sorting work together. I can get the sorting to work, and I can get the formatting to work. But when I try to sort dates in format "d/m/y" they sort as strings.

I use jqGrid 3.6.4, and the problem occurs with both jQ 1.4.2(jQueryUI 1.8) and 1.3.2(jQueryUI 1.7.2). I am pretty confident I have downloaded the appropriate modules.

I changed the date format in grid.locale-en.js to:

                srcformat: "Y-m-d",
                newformat: "d/m/y",

When sorting by date, 4 Oct 2010 should be at the bottom of the list.

NB I actually want to make this work within tableToGrid. I can't make it work there, but I thought if it can be fixed here then it should be OK to use from within tableToGrid

Does anyone have any ideas?

Here's the code.

<!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>

        <style type="text/css">
            body {font-size: 62.5%; }
        </style>

        <script type="text/javascript">
        $().ready(function()
        {
            $("#Table_JSON").jqGrid(
            {
                caption: "Manipulating Array Data - JSON",
                datatype:    "local",
                sortable:    true,
                colNames:    ['Inv No','Date', 'Client', 'Amount','Tax','Total 2','Notes'],
                colModel:    [
                                {name:'id',index:'id', width:160, sorttype:"int"},
                                {name:'invdate',index:'invdate', width:110, formatter:'date', sorttype:"date"},
                                {name:'name',index:'name', width:100},
                                {name:'amount',index:'amount', width:80, align:"right",sorttype:"float"},
                                {name:'tax',index:'tax', width:80, align:"right", sorttype:"float", formatter:'currency' },
                                {name:'total',index:'total', width:80,align:"right",sorttype:"float"},
                                {name:'note',index:'note', width:150, sortable:false}
                            ]
            });
            var mydata = [
                        {id:"1",invdate:"2007-10-01",name:"test",note:"note",amount:"200.00",tax:"1000",total:"210"},
                        {id:"10",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20",total:"320"},
                        {id:"3",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30",total:"430"},
                        {id:"4",invdate:"2010-10-04",name:"test",note:"note",amount:"200.00",tax:"10",total:"210"},
                        {id:"5",invdate:"2007-10-05",name:"test2",note:"this is a longer note2",amount:"300.00",tax:"20",total:"320"},
                        {id:"6",invdate:"2007-9-06",name:"test3",note:"note3",amount:"400.00",tax:"30",total:"430"}];
            for(var i=0;i<=mydata.length;i++)
                $("#Table_JSON").jqGrid('addRowData',i+1,mydata[i]);
        });
        </script>

    </head>
    
    <body>
        <table id="Table_JSON">
        </table>
    </body>
</html>

]]> Sun, 28 Mar 2010 21:47:42 +0300