Using UTC dates between .NET and JavaScript

Question

I'm using ASP.NET MVC, and I wish to store all my DateTime values on the server in UTC format. And I wish for all transmission of DateTime values to be in UTC format. But I want to display DateTimes in the browser in local time. I've been getting confused and having trouble making it work. Below is my process....

In my UI, the user is able to enter a date which I compose into a string and use to create a Date object. It ends up looking like this:

var dt = new Date("3/23/2012 8:00 AM");

So the user intends to create a Date for 8 AM their time. Now I wish to send this to the server in UTC format so I have this method:

Date.prototype.toUTC = function ()
{
    var self = this;
    return new Date(self.getUTCFullYear(), self.getUTCMonth(), self.getUTCDate(), self.getUTCHours(), self.getUTCMinutes());
};

Which I use like so:

data.startDt = dt.toUTC();  //Data is the object being set to the server

Then I make an Ajax call using jQuery to send the data object to the server. On the server when I debug, and examine the data that comes in I see StartDt (which is mapped to a .NET DateTime object) as being {3/23/2012 12:00:00 PM}.

This is the value I store in my database. I'm not totally certain it is correct though.

Both the client and server are located in the Eastern United States (UTC-05:00).

Now, when I send this date back to the client in JSON format .NET sends this:

"/Date(1332518400000)/"

In JavaScript I parse it this way:

var dt = new Date(parseInt(serverDt.substr(6)));    //parseInt ingnores last /

My thinking is that dt is a UTC Date, but that I can display it in in local format by calling toShortTime() as shown below:

Date.prototype.get12Hour = function ()
{
    var h = this.getHours();
    if (h > 12) { h -= 12; }
    if (h == 0) { h = 12; }
    return h;
};

Date.prototype.getAMPM = function ()
{
    return (this.getHours() < 12) ? "AM" : "PM";
};

Date.prototype.toShortTime = function ()
{
    return this.get12Hour() + ":" + this.getMinutes() + " " + this.getAMPM();
};

But that doesn't give me the 8:00 AM back that I want. It gives me the 12:00 PM. Where am I going wrong?

Answer 1

In your code, dt is a UTC time. You need to convert that from UTC to local time.
See Javascript: Convert a UTC Date() object to the local timezone

Answer 2

Are you constructing the .NET DateTime object with the appropriate DateTimeKind value? You're sending a UTC-relative value to the server, which I'm guessing is storing the value as an EDT-relative time instead of a UTC-relative time, hence the incorrect value. As you stated, 1332518400000 is 12PM EDT, not UTC, which points to a transcription problem on the server:

> new Date(1332518400000)
Fri Mar 23 2012 12:00:00 GMT-0400 (Eastern Daylight Time)

Answer 3

This function works beautifully for me.

function ParseDateForSave(dateValue) {
    // create a new date object
    var newDate = new Date(parseInt(dateValue.substr(6)));

    // return the UTC version of the date
    return newDate.toISOString();
}