0

My jqGrid is showing (1303153262000) on the initial grid load. However when the column is sorted the date is correctly formatted to (Aug 18 11:43 AM). Is there a way to get the grid to do this formatting automatically when it loads?

This is exactly what the date looks like as it is returned from the server (2011-04-18 19:01:02).

Here is the jqGrid column model i am using:

jQuery("#list4").jqGrid({
datatype: "local",
height: 250,
colNames:['Original ID','Date Created', 'Type', 'Title'],
colModel:[  
{name:'Id',index:'Id'},
{name:'cDate',index:'cDate', width:120, sorttype:'date', formatter:'date',     formatoptions: {srcformat:'M d h:i', newformat:'M d g:i A'}},  
{name:'xData',index:'xData', width:120}, 
{name:'zData',index:'zData', width:140}
],
rowNum: 1000,
multiselect: true,
toolbar: [true, "top"]
});

Any help would be greatly appreciated! Thanks.

Edit:

@Oleg here is what the data looks like on the server side:

2011-04-18 19:01:02
2011-04-18 19:01:28
2011-01-07 01:00:20
2011-04-18 19:01:02
2011-04-18 19:01:28
2011-01-07 01:00:20
2011-06-29 22:20:29
2011-06-29 21:47:55

And here is what it looks like when returned into the jqGrid:

Test: 1303153262000
Test: 1303153288000
Test: 1294362020000
Test: 1303153262000
Test: 1303153288000
Test: 1294362020000

Am i going to have to create a new array with the returned results with a function to change the epoch date to the date format i want? Having to do so would not make sense as jqGrid obviously has that functionality, but only when a user clicks sort. Is there a way to make jqGrid do this when the page loads?

I pulled this from eclipse. I am using a list/array called NotesArray. This is the array that is returned from the server:

NotesArray:{Original_Created_Date__c=2011-07-01 01:06:55, Title__c=Title of message 1 00001073: 06/30/2011 18:07:07, Type__c=Task, Id=a0D8000000Na0Q0EAJ, Originating_Id__c=00T8000001nuEzPEAU}
NotesArray:{Original_Created_Date__c=2011-06-30 22:14:48, Title__c=Title of message 2 00001072: 06/30/2011 15:15:00, Type__c=Task, Id=a0D8000000Na0Q1EAJ, Originating_Id__c=00T8000001nuCccEAE}
NotesArray:{Original_Created_Date__c=2011-06-30 21:24:47, Title__c=Title of message 3 00001071: 06/30/2011 14:25:00, Type__c=Task, Id=a0D8000000Na0Q2EAJ, Originating_Id__c=00T8000001nuB5cEAE}
NotesArray:{Original_Created_Date__c=2011-06-30 21:19:48, Title__c=Title of message 4 00001070: 06/30/2011 14:20:00, Type__c=Task, Id=a0D8000000Na0Q3EAJ, Originating_Id__c=00T8000001nuBFiEAM}
NotesArray:{Original_Created_Date__c=2011-06-30 21:14:47, Title__c=Title of message 5 00001069: 06/30/2011 14:15:00, Type__c=Task, Id=a0D8000000Na0Q4EAJ, Originating_Id__c=00T8000001nuAzDEAU}
NotesArray:{Original_Created_Date__c=2011-06-30 21:09:47, Title__c=Title of message 6 00001068: 06/30/2011 14:10:00, Type__c=Task, Id=a0D8000000Na0Q5EAJ, Originating_Id__c=00T8000001nuASSEA2}

Changed the return to JSON:

{"rows": [{"ObjectType": "Event","CreatedDate": "2011-01-03 09:16:51","ActivityType": "Call","OriginalId": "00U8000000Elxb4EAB","Title": "TEST EVENT"},{"ObjectType": "Event","CreatedDate": "2011-01-03 08:53:22","ActivityType": "Meeting","OriginalId": "00U8000000ElxY9EAJ","Title": "sadfasdf"},{"ObjectType": "Event","CreatedDate": "2011-01-03 08:51:04","ActivityType": "Meeting","OriginalId": "00U8000000ElxXkEAJ","Title": "werwrasdf"},{"ObjectType": "Task","CreatedDate": "2011-01-06 14:42:43","ActivityType": "Call","OriginalId": "00T8000001bce9VEAQ","Title": "test"},{"ObjectType": "Task","CreatedDate": "2011-01-03 08:50:41","ActivityType": "Meeting","OriginalId": "00T8000001aiqAXEAY","Title": "asdfasdfasf"},{"ObjectType": "Task","CreatedDate": "2011-01-03 08:50:29","ActivityType": "Call","OriginalId": "00T8000001aiqAcEAI","Title": "asdfsaf"},{"ObjectType": "Task","CreatedDate": "2011-01-03 08:52:55","ActivityType": "Call","OriginalId": "00T8000001aiqBuEAI","Title": "asdfsaf"},{"ObjectType": "Note","CreatedDate": "2011-08-22 15:17:11","ActivityType": "Note","OriginalId": "0028000000T03CUAAZ","Title": "Mondays Best"},{"ObjectType": "Note","CreatedDate": "2011-08-18 11:43:25","ActivityType": "Note","OriginalId": "0028000000SzwIjAAJ","Title": "Note Test"}]}
Tony H.
  • 1,975
  • 4
  • 14
  • 20
  • I don't have an answer, but 1303153262000 is the number of milliseconds since the "Unix epoch", 1970-01-01 00:00:00 UTC, as of 2011-04-18 19:01:02. – Keith Thompson Aug 22 '11 at 19:31

1 Answers1

1

If the date come from the server as '2011-04-18 19:01:02' why you use 'M d h:i' instead of 'Y-m-d H:i:s' as the value of srcformat?

If the usage of

formatoptions: {srcformat:'Y-m-d H:i:s', newformat:'M d g:i A'}

will not solve your problem you should include the exact example of the input data which you use to fill the 'cDate' column.

UPDATED: You can load the JSON data which you posted directly in the jqGrid. See the modified demo here. What you need is just to use in the jqGrid the names on columns like in the JSON data and additionally you should use

loadonce: true,
jsonReader: {
    repeatitems: false,
    id: "OriginalId",
    root: "rows",
    page: function (obj) { return 1; },
    total: function (obj) { return 1; },
    records: function (obj) { return obj.length; }
}

In the demo I added one more column because I don't know whether ObjectType or ActivityType you want display in the 'Type' column. You can remove from jqGrid (not for JSON) any column which you not need to display. For example if the contain from the OriginalId column are not interesting for the user you can remove the corresponding column from the grid.

Oleg
  • 220,925
  • 34
  • 403
  • 798
  • Test: 1303153262000 Test: 1303153288000 Test: 1294362020000 Test: 1303153262000 Test: 1303153288000 Test: 1294362020000 – Tony H. Aug 23 '11 at 16:28
  • @Antonio Herrera: The code which you posted has `datatype: "local"`. So it's unclear **how you fill the grid**. You wrote that you get the data *from the server*. Why you don't use `datatype: "json"` or `datatype: "json"`? How I understand you the data are displayed in the wrong way only at the **initial grid load**, but you don't included the code of the *initial grid filling (load)*. Could you add the code to your question? – Oleg Aug 23 '11 at 17:23
  • @Antonio Herrera: Look at [the demo](http://www.ok-soft-gmbh.com/jqGrid/AntonioHerrera.htm). Is it not what you want? – Oleg Aug 23 '11 at 17:47
  • Ahhh, sorry @Oleg yes i did leave that out accidentally. This is the loop i use to fill the grid with the data returned by java => for(var i=0;i<=records.length;i++) { jQuery("#list4").jqGrid('addRowData',i+1,records[i]);} – Tony H. Aug 23 '11 at 18:29
  • @Antonio Herrera: The `addRowData` mathod place **raw** data in the grid **without any data formatting**. Why you not load the data from the server like in [my demo](http://www.ok-soft-gmbh.com/jqGrid/AntonioHerrera.htm)? – Oleg Aug 23 '11 at 18:31
  • yes that demo is what i'm looking for. Since my dates get turned into epoch numbers upon return from java, i don't have the 'initial' date formatting that your json file does. – Tony H. Aug 23 '11 at 18:32
  • @Antonio Herrera: In what format you return the data exactly from the server? Could you use Fiddler or Firefox to catch the data and place the data in the text of your question. I could include the corresponding `jsonReader` parameter which you can use in jqGrid to fill the grid with the data. – Oleg Aug 23 '11 at 18:42
  • I was able to display the array data in eclipse (not sure how to in firebug). I posted that array above in the original post. Is there a way to append the array data into jsonReader somehow? – Tony H. Aug 23 '11 at 19:35
  • @Antonio Herrera: The information which you send gives no information about the format of the data send over HTTP. So I see two ways: 1) You posted `for(var i=0;i<=records.length;i++) { jQuery("#list4").jqGrid('addRowData',i+1,records[i]);}` in the comment before, but you not posted the code **how you get `records` array**. If you use `jQuery.ajax` you should post the code. 2) You can use [Fiddler](http://www.fiddler2.com/fiddler2/) to catch HTTP traffic between your client and the server. Just try it and you will probably see all raw HTTP data automatically. – Oleg Aug 23 '11 at 21:27
  • i was able to change the return data to JSON. Can you please take a look at that JSON up above and let me know what you see wrong with it. The grid is not getting populated by that data. – Tony H. Aug 23 '11 at 21:28
  • @Antonio Herrera: OK! It's clear everything. I updated my answer. See [the new demo](http://www.ok-soft-gmbh.com/jqGrid/AntonioHerrera1.htm). – Oleg Aug 23 '11 at 21:53
  • this looks really good. But real quick, is there a way to use the json response without it being a separate file? I'm working in an environment where i cannot create additional .json files. – Tony H. Aug 23 '11 at 22:25
  • @Antonio Herrera: Of course you should use as `url` the URL path to the server which provide the JSON data in the format which you posted me. It is not important whether the data are created dynamically by the you web server or will be gat from the file. – Oleg Aug 23 '11 at 22:34
  • :) I can't thank you enough for all the time you put into helping me. I'm working in a different environment than most. Therefore i didn't know if this was possible or not. I just now got it to work after pointing the URL to the right place (this was the most difficult as i am not working with a typical server technology). But i couldn't have done it without you. The dates are now showing up nicely upon the initial generation of the grid. Thank you again!! But I still feel that the grid should work with a returned array from the server, on the same page, rather than a seperate url. :)> – Tony H. Aug 25 '11 at 00:10
  • @Antonio Herrera: You are welcome! If the JSON data provide the server, the usage of `url` parameter and `jsonReader` it the best way. If you have local data you can use `datatype:'local'` and `data` parameter or `datatype: 'jsonstring'` and `datastring` parameter. In any way the usage of `addRowData` to fill the grid is wrong and it was your main error. Best regards. – Oleg Aug 25 '11 at 07:06
  • I know this is a year old, but the 13-digit numbers are what you get back when a Java Calendar object is serialized by certain JSON parsers, specifically Jackson (which is used a lot due to its integration with Spring). It's a Unix timestamp with milliseconds (or is that microseconds?) included. – Powerlord Jul 30 '12 at 16:11
  • @Powerlord: You can use custom formatter for example. See [the answer](http://stackoverflow.com/a/9313736/315935) for one possible code example. – Oleg Jul 30 '12 at 16:32
  • @Oleg: A better solution is probably to change [Jackson's configuration](http://wiki.fasterxml.com/JacksonFAQDateHandling) to return ISO8601 dates. This can also be [done through Spring](http://stackoverflow.com/questions/9576907/where-do-i-specify-jackson-serializationconfig-feature-settings-in-spring-3-1). – Powerlord Jul 30 '12 at 16:35
  • @Powerlord: I agree that the usage of ISO8601 dates is better if you can use it. In the case the date will be clear ordered to some time zone. If you need to specify the date inclusive the time you would need to add `srcformat:'ISO8601Long'` format option (see [here](http://stackoverflow.com/a/6477167/315935) and [here](http://stackoverflow.com/a/10010809/315935)) – Oleg Jul 30 '12 at 16:41
  • @Oleg: Having said that, I haven't been able to get Spring and/or Jackson to change its configuration (I'm still getting 13-digit numbers back instead of an ISO8601 date), so I may have to go the custom formatter route after all. – Powerlord Jul 31 '12 at 14:53