JavaScript Programming

Working With Dojo’s DateTextTime Field

June 7, 2009

I’ve been working with Dojo for a couple of weeks now, and let me just say I’ve fallen in love with it and all it has to offer. It allows me to quickly and efficiently integrate dynamic content into all of my web projects with a very small learning curve.

Despite the abundant amount of documentation out there I still find myself getting stuck on the odd little thing. For example, I was working with Dijit’s DateTextTime field and simply could not get it to take a date I passed in. If I did it directly through HTML by setting the value attribute it would work, however when setting it in JavaScript as part of my AJAX call it would fail every time. I dugg around the Dojo community eventually finding someone who had the same issue and had managed to solve it “after several hours of trial and error” but sadly he neglected to post his solution. Thus I wanted to make mine available for anyone who finds themself working on the same problem.

I was working with the Dojo Toolkit as a reference and sadly it only stated that you used the SetValue() method to assign a date, but it did not provide the required syntax. After much trial and error I eventually discovered it wasn’t expecting that I pass it in as a string at all, rather it had to be set as a JavaScript date object first. So here is the required steps to assign a date to a DateTextTime field:

// Now
var dateA = new Date(); 

// January 1, 2009 
// Note that the months start from 0 but days start from 1
var dateB = new Date(2009, 0, 1); 

// Parsing a string returne from MYSQL, in the format of YYYY-MM-DD
var dateC = new Date(data["ExpiryDate"].substr(0,4), parseInt(data["ExpiryDate"].substr(5,2))-1, data["ExpiryDate"].substr(8,2)); 

// Pass Date Objects into Dijit
dijit.byId("registered").setValue(dateA);
dijit.byId("bdate").setValue(dateB);
dijit.byId("expiryDate").setValue(dateC);

// Reference
// http://www.w3schools.com/jS/js_obj_date.asp

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.