How do I get a date from a Rails app into a Sencha Touch 2 app without it being an invalid date?

Question

Problem: Get a date inside of a JSONP response that looks like "2012-11-11T04:27:25Z" (which is the default date output from a Rails app) into a date field in a model instance in a Sencha Touch 2 app without it being an Invalid date.

Background: I have a Rails app that is generating JSONP, which I read into a Store in my Sencha Touch 2 app, and the date, as formatted by Rails comes into the Sencha Touch 2 app as an Invalid Date.

To reproduce: To reproduce the problem for this question and duplicate the error, use the Fiddle below. Note: I took the Rails server out of the picture by hard-wiring the data into a store with a date formatted the same way my Rails app has been outputting them. So, in other words, I have reproduced the entire problem locally in the Sencha Touch 2 app by mimicking what my Rails app does server-side.

Fiddle: http://www.senchafiddle.com/#7qQkb. To see the problem, run the Fiddle from a Webkit browser and view the JavaScript console inside the Webkit Developer Tools.

Symptom: What will happen is that the XTemplate that is created by the List component within the app executes code (inside {[]} brackets) to output a date for your inspection in the console. When you inspect the date that is outputted, you will see: __proto__: Invalid Date. The date will still show up just fine in the view, but because it is an invalid date, I cannot format the date or retrieve different parts of the date object.

My question is this: Is there something that I can do to my model or my store, or alternatively to my Rails app, to get the date into a model instance without it being an Invalid Date?

Your question is little bit long. Are u basically asking how to validate a date in rails? — emrahbasman
No, I'm asking how a date that comes out of Rails over JSONP can form a valid date in a Sencha Touch 2 app. — Morris Singer
@Emrah, I edited the question to reduce the length. Hope that helps. — Morris Singer
Sorry i have zero knowledge about sencha. Try to use unix time in your jsonp and parse the date in sencha. Or use unix time in both sides. — emrahbasman

lontivero lontivero · Accepted Answer · 2012-12-26T18:14:28

What you see is just the returned value of toString method in the Date prototype

Date.prototype.toString(); // "Invalid Date"

That´s why absolutly all the "dates" say exactly the samething. However, it doesn´t mean date are wrong! In extjs, if you want to format a date field in you model you should use:

{ name: 'timestamp', type: 'date', dateFormat: "Y-m-d H:i" }

But if you only want to format it to display it, you can use the format yo used, one of the named built-in format or just the sameone I used in the example: Y-m-d H:i

How do I get a date from a Rails app into a Sencha Touch 2 app without it being an invalid date?

2 Answers