I have a script that I am attempting to convert a UTC date/time to local timezone. It all seems to be working well in Chrome and IE/Edge, but shows "invalid date" in Firefox. There are several other questions out there on stack but none seem to address my specific need.

My script does this...

Gets a date that is a specific format put out by Fabrik in Joomla. (I have little control over this format)

it looks like this:

2017-07-02 20:57

And then I create a new date as UTC and convert that to a Local timezone.

toLocalString method:

$(document).ready(function() {
        $('.plg-date > .fabrikElement > div').not('.fabrikSubElementContainer').each(function() {
            if($(this).text().length > 0) {
                var newdate = new Date($(this).text() + " UTC");
                var options = { 
                    year: 'numeric', 
                    month: 'numeric', 
                    day: 'numeric',
                    hour: '2-digit',
                    minute: '2-digit',
                    timeZoneName: 'short'
                }
                $(this).text(newdate.toLocaleString('en-US', options)); 
            }
        })
    });

moment.js method:

$(document).ready(function() {
    $('.plg-date > .fabrikElement > div').not('.fabrikSubElementContainer').each(function() {
        if($(this).text().length > 0) {
            var date = new Date($(this).text() + " UTC");
            var newdate = moment(date).format('ddd MMM DD YYYY h:mm A')
            $(this).text(newdate);
        }
    })
});

both methods result in invalid date in firefox. suggestions?

I have a script that I am attempting to convert a UTC date/time to local timezone. It all seems to be working well in Chrome and IE/Edge, but shows "invalid date" in Firefox. There are several other questions out there on stack but none seem to address my specific need.

My script does this...

Gets a date that is a specific format put out by Fabrik in Joomla. (I have little control over this format)

it looks like this:

2017-07-02 20:57

And then I create a new date as UTC and convert that to a Local timezone.

toLocalString method:

$(document).ready(function() {
        $('.plg-date > .fabrikElement > div').not('.fabrikSubElementContainer').each(function() {
            if($(this).text().length > 0) {
                var newdate = new Date($(this).text() + " UTC");
                var options = { 
                    year: 'numeric', 
                    month: 'numeric', 
                    day: 'numeric',
                    hour: '2-digit',
                    minute: '2-digit',
                    timeZoneName: 'short'
                }
                $(this).text(newdate.toLocaleString('en-US', options)); 
            }
        })
    });

moment.js method:

$(document).ready(function() {
    $('.plg-date > .fabrikElement > div').not('.fabrikSubElementContainer').each(function() {
        if($(this).text().length > 0) {
            var date = new Date($(this).text() + " UTC");
            var newdate = moment(date).format('ddd MMM DD YYYY h:mm A')
            $(this).text(newdate);
        }
    })
});

both methods result in invalid date in firefox. suggestions?

• javascript
• date
• datetime
• firefox
• momentjs

• 1 Create the date instance with Moment and an explicit format describing the date strings you've got. That's the only safe thing to do; browsers do whatever they want when you give them a string that's not in the spec. – Pointy Commented Jul 5, 2017 at 15:12
• 1 If you feed the Moment library with a Date object you've already created by yourself, you aren't going to benefit from Moment's date parsing features. Either stick to Moment or drop it entirely. – Álvaro González Commented Jul 5, 2017 at 15:19
• Changing " UTC" to "Z" or "+00:00" should work, as those generate accepted ISO8601 date strings. – James Commented Jul 5, 2017 at 15:45

2 Answers 2

Using moment you can use moment.utc and local():

var newdate = moment.utc($(this).text()).local().format('ddd MMM DD YYYY h:mm A')

moment.utc parses your input as UTC value, while local() converts it to local time.

Your format strings don't match what either API needs. You are currently passing the text (2017-07-02 20:57) with UTC appended to the end (i.e. 2017-07-02 20:57 UTC). In a javascript console:

new Date("2017-07-02 20:57");
Date 2017-07-02T19:57:00.000Z
new Date("2017-07-02 20:57 UTC")
Invalid Date

It should work if you drop the UTC ponent. Notice, though, that javascript is turning 20:57 into 19:57. This is because of daylight savings, which might occur on a client's puter. Whether this affects your app depends on where the timestamps are ing from.

As for the moment example you gave, your format string should be YYYY-MM-DD HH:mm for your input string.