Storing Dates as Strings in Flex while using Date Components and Date Sorting

Due to an existing implementation of the application I’m working on and problems transferring Dates from Fluorine (.NET Remoting Gateway) to Flex, I decided to store and pass all my Dates as Strings. At first, this seemed like a reasonable and easy to implement change. As time has gone on, more and more problems seem to arise. I’m sure the best thing to do would be to find a way to use Date-typed Dates, but I’ve figured out and thought I’d share some workarounds/hacks in case anyone else is trying to/forced to use Strings as Dates.

1) Binding my dates to a DataGrid column:
In order to have my dates display in the form mm/dd/yyyy, I do the following:
Call a labelFunction named “dateLabel” which then calls a static function from my Util package “formatDateDisplay”
[xml]

[/xml]
[as]
private function dateLabel(item:Object, column:DataGridColumn):String
{
return Utils.formatDateDisplay(item[column.dataField]);
}
[/as]
[as]
//This is found in my Utils Package
public static function formatDateDisplay(date:String):String
{
// This removes any time data that is appened onto my Date String
return date.substr(0, date.search(’ ‘));
}
[/as]

2) My DataGrid Columns should be able to be sorted by Date rather than by String Comparison
Call a sortCompareFunction named “dateMyDatePropertyCompare” which then calls a static function from my Utils package “dateFromStringSortCompare”
[xml]

[/xml]
[as]
private function dateMyDatePropertyCompare(obj1:Object, obj2:Object):int
{
return Utils.dateFromStringSortCompare(obj1.myDateProperty, obj2.myDateProperty);
}
[/as]
[as]
public static function dateFromStringSortCompare(obj1:String, obj2:String):int
{
var date1:Date = (obj1 == ” || obj1 == null) ? null : new Date(obj1);
var date2:Date = (obj2 == ” || obj2 == null) ? null : new Date(obj2);

if (date1 < date2)
return -1;
else if (date1 > date2)
return 1;
else
return 0;
}
[/as]

3) Binding my String-Date to a DateField
You can not bind a String to a DateField selectedDate property, so it must be cast into a Date Type. The only way I’ve found to make this Bind is to do the following:
[xml]
selectedDate=”{(model.myDateProperty == null || model.myDateProperty == ”) ? null : new Date(model.myDateProperty)}”
[/xml]
and to save the DateField value to a String:
[as]
obj.myDateProperty= myDateField.selectedDate.toDateString();
[/as]

My hope is that one of the following happens from this post:

- Someone can save some time and use something I’ve written here
- I’ll learn a much cleaner way to do this and I’ll follow this up with a “I can’t believe i was doing that, now I’m doing this…post”

Comments are welcome and hoped for as always….

3 Comments

  1. darron says:

    You shouldn’t let the communication protocol dictate how the front end is coded. Use date values on the flex side because it will result in much cleaner code, and then take advantage of the business layer to do the conversion to strings to send values off to the server (and convert strings received from the server into dates before setting values in the model).

    When/if Flourine is updated to support Date types, your UI code ca stay the same and you can just remove the hooks in the business layer to do the conversion when talking to the server… and then you’re not left with string hacks all over the place when you really want to use Date objects to begin with.

  2. I fully agree with darron.

    The DateUtil helper has a function called ‘parseW3CDTF’ that returns a Date object from the format .Net spits out by default. Just as well you can convert to this format with the ‘toW3CDTF’ function. DateUtil is part of CoreLib that can be found on Adobe Labs. It’s a little bit edgy when it comes to timezones though.

    When were talking .Net and Flex, check out http://develop.itmaskinen.se/labs/snoozenet/

    Best regards,
    Erik Pettersson

  3. Michael says:

    Thanks, Sam - this was useful

Leave a Reply