PDA

View Full Version : grid and dateRenderer



thedave
5 Feb 2008, 7:40 AM
Hi Forum!

I couldn't find this problem via search, so perhaps any one has a little hint for me. I am getting some Json data and display this with my grid. Everything works fine, except the date. When I use no renderer, the date is displayed correctly as a string. But I am not sure if this will work with sorting.

This is the working header:


{header: "start", width: 75, sortable: true, dataIndex: 'START_DATE'}

This will output NaN.NaN.NaN


{header: "finish", width: 75, sortable: true, renderer: Ext.util.Format.dateRenderer('d.m.y'), dataIndex: 'END_DATE'}

This is my Json input:


{"data":[{"ID":"169","RESOURCE_ID":"1","START_DATE":"26.12.07","END_DATE":"10.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"196","RESOURCE_ID":"3","START_DATE":"01.01.08","END_DATE":"04.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"1"},{"ID":"223","RESOURCE_ID":"1","START_DATE":"02.01.08","END_DATE":"03.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"224","RESOURCE_ID":"1","START_DATE":"05.01.08","END_DATE":"09.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"225","RESOURCE_ID":"1","START_DATE":"26.01.08","END_DATE":"31.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"226","RESOURCE_ID":"1","START_DATE":"31.01.08","END_DATE":"01.02.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"227","RESOURCE_ID":"1","START_DATE":"09.01.08","END_DATE":"09.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"228","RESOURCE_ID":"1","START_DATE":"01.01.08","END_DATE":"23.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"229","RESOURCE_ID":"1","START_DATE":"25.01.08","END_DATE":"25.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"230","RESOURCE_ID":"1","START_DATE":"24.01.08","END_DATE":"31.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"},{"ID":"231","RESOURCE_ID":"1","START_DATE":"24.01.08","END_DATE":"24.01.08","WORKLOAD":"10","DESCRIPTION":null,"TASK_ID":"5853","TYPE":"0"}],"success":true,"message":"..."}

I think this is a minor problem, but I just can't find my error. Is the format string wrong? Is there some kind of format-string list for Ext?

Any help is appreciated! Thanks.

Condor
5 Feb 2008, 7:43 AM
The data in your store is a string, so formatting it as a date it won't work.

Define your field as:


{name: 'START_DATE', type: 'date', dateFormat: 'd.m.y'}

thedave
5 Feb 2008, 8:01 AM
Thanks for this very quick answer.

So the renderer takes a dateobject? Mostly the data will be retrieved from a database, so its never a dateobject? Unfortunately, this is the case here. Is there a way to manipulate this string with dateFormat? Like dateFormat: 'd.m.yy' (to get the full year 2008 instead of 08)?

Or is this a task for the backend where the Json string is generated?

Thanks for your help!!

gtomalesky
2 Jul 2008, 10:06 AM
Hi All:

I have a grid in which I need to display a date, The date is returned from my server as milliseconds from 1/1/1970. In my renderer I am using "Ext.util.Format.date(v,'M-d-Y')" and I get an error as:"Date.monthNames[A] has no properties" If I try to use a numeric representation I get NANs in all the fields. What am I doing wrong?

Thanks

mystix
2 Jul 2008, 7:45 PM
first up, either check out the latest Date.js from SVN, or include the fixes posted here:
http://extjs.com/forum/showthread.php?p=156047#post156047
if you're using the official 2.1 download.

next, since there's no matching parse format in the Date class for milliseconds since the unix epoch, make sure you don't specify any dateFormat for the json string returned from the server.
e.g.


...
{name: 'mydate', mapping: 'mydateFromServer', type: 'string'} // treat it as a plain string
// {name: 'mydate', mapping: 'mydateFromServer', type: 'int'} // or as an integer value if you want
...


once done, change your renderer to:


renderer: function(v) {
// divide value from server by 1000 to obtain the no. of seconds since unix epoch,
// parse the result to obtain a Date object, then format it using Date.format()
Date.parseDate((Math.floor(v / 1000), 'U').format('M-d-Y');
}