I have a datepicker which was returning a moment object that was always in UTC timezone. I needed to do some logic on this date, but always wanted it in the users local timezone so I did the following:
//strip submission date of timezone offset
let submission_date = moment(this.state.startDate).format('YYYY-MM-DD hh:mm:ss a');
submission_date = moment(submission_date);
let last_date = this.last_date.diff(submission_date, 'days');
However, when I do this my iPhone complains that submission_date is not a valid date. Desktop is fine so I'm guessing this is a safari issue. When I inspect this.state.startDate just prior to being momentized it's a string like 2018-11-01T17:52:44-00:00
Shouldn't moment accept that as a valid date?
I had figured out that it's the a flag in the format string. I changed it to YYYY-MM-DDTHH:mm:ss and it worked perfectly. Safari must not like am/pm data.
Try wrapping up with String function
//strip submission date of timezone offset
let submission_date = moment(String(this.state.startDate),'YYYY-MM-DD hh:mm:ss a');
let last_date = moment(String(this.last_date),'YYYY-MM-DD hh:mm:ss a').diff(submission_date, 'days');
Safari engine has some unique way of processing/parsing the date object
follow this format. year should be at the beginning. have to use "/" instead of "-".
cannot use "MMM" for month
YYYY/MM/DD hh:mm A
I solved this problem by ensuring all the letters in my ISO8601 formatted date-time (such as T and Z) were upper case. When they were lower case, moment failed to parse the date-time string.
Related
I am trying to get specific format of datetime with time zone
i am getting string of time format which is shown below
var dateTime = "2020-06-01T01:50:57.000Z CDT"
I need to convert the format in to
const offsetTime = moment(date).add("-0.00", 'hours')
const formatedDate = moment(offsetTime, 'h:mm:ss A')
.utc()
.format('h:mm A')//(1:50 AM)
Required output
(1:50 AM CDT)
Do i need to split the string and get the format or do we have any method to convert it to this format in momentjs
In simple way to say
YYYY-MM-DDTHH:mm:ss.SSS[Z] z To hh:mm A z //format
and if the string contains only 2 character like "CT" instead of CDT how to capture that.
You can zz to get timezone in output. For ex:
moment()..format('h:mm A zz')
More documentation here momentJS
Use the moment-timezone to achieve this. Use the moment constructor to specify the input format, then specifying the required timezone. Finally use moment's format to get the required format
var dateTime = "2020-06-01T01:50:57.000Z CDT";
var timezone = "America/Chicago";
console.log(
moment(dateTime, "YYYY-MM-DD hh:mm:ss zz")
.tz(timezone)
.format("h:mm A zz")
);
<script src="https://momentjs.com/downloads/moment.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.23/moment-timezone-with-data-2012-2022.min.js"></script>
Your date string is in ISO format with the 'Z' after seconds indicating that it is in UTC time. I am assuming that the 'CDT' is placed in the string in order to indicate which time zone this should be converted to. If you have control over how this string is represented then I recommend changing it so that you indicate the desired timezone elsewhere and simply store the date in UTC format. This way you can initialize a date or moment object with the ISO string as follows:
var date = moment("2020-06-01T01:50:57.000Z")
It is inconvenient the way it is currently since you cannot initialize it this way:
var date = moment("2020-06-01T01:50:57.000Z CDT")
The only option for handling the date in its current form is to parse it. You can do that like this:
var dateTime = "2020-06-01T01:50:57.000Z CDT"
var trimmed = dateTime.trim() // remove leading and trailing whitespace
var isoString = trimmed.substr(0, trimmed.indexOf(' '))
Which will produce the following string
2020-06-01T01:50:57.000Z
You can use that string I called "isoString" to initialize a date or moment object. The next obstacle is to handle converting that UTC string to a certain timezone (in this case CDT). It is simple if you want to convert the UTC date to the current users timezone since that will happen automatically when you initialize the moment or date object with the ISO date string. Otherwise, you need some way to get the timezone from 'CDT' into the format moment wants which was shown by #vjr12 ("America/Chicago"). The only way to do this is to either store that with the date string or create a mapping. It is much easier to convert from "America/Chicago" to "CDT" than it is to convert from "CDT" to "America/Chicago". Your only option with the current form is to create your own mapping from "CDT" to "America/Chicago". You could do something like:
let tzMap = new Map()
tzMap.set('CDT','America/Chicago')
// Set the rest of your timezones
You would need to do that for all timezones and then you could use the timezone parsed from your date string like this:
var tzAbbr = trimmed.substr(trimmed.indexOf(' ') + 1)
which will grab the "CDT" or "CT" for that matter. Then you could use your mapping like this:
var timezone = tzMap.get(tzAbbr)
timezone will be "America/Chicago" in this case and then you can use #vjr12 solution from here to get the form you want.
Note
I highly recommend that (if you are able) to change the current format of the datestring that you are using. The purpose of using UTC time is to be timezone agnostic so it does not make sense to store the timezone with the UTC string. If you want to preserve the timezone then you would be better off using a format which already embeds the timezone.
I am getting 4 dates as inputs mentioned below from an external source.
Dates with time element:
"InitialDate": "2019-02-19T12:03:22.129Z",
"updateDate": "2019-02-28T05:26:57.115Z",
Dates without time element:
"startDate": "2019-02-18",
"endDate": "2020-02-16",
I am coverting InitialDate and updateDate and creating actualInitDatE out of them using a moment format as below, as they are getting time element also in it.
I don't want time element and i only want date elements of all the 4 dates.
const actualInitDatE = moment(InitialDate).format('MM-DD-YYYY') ||
moment(updateDate).format('MM-DD-YYYY');
Now, I am converting the startDate and endDate which are having only date element in it (and no time element) and finally creating actualStartDate and actualEndDateW variables,
const actualStartDateW = moment(startDate).format('MM-DD-YYYY');
const actualEndDateW = moment(endDate).format('MM-DD-YYYY');
Now I am comparing them with the below logic and is working fine in IST,
if (actualInitDatE >= actualStartDateW && actualInitDatE <= actualEndDateW) {
console.log('Compared and True');
}
My Doubt is will this work correctly in UTC and other time zones as well? I am doubtful because some of the dates have time elements and some of them have only the date elements.
I have gone through this and implemented the approach. Is this approach is correct or do we need to use any offset?
javascript Date timezone issue
Can someone help me in this regard and let me know if this code works across timeZones?
I believe the core issue here is that you must specify a timezone for startDate and endDate. If you don't, moment.js will assume local time, for example IST or let's say you were in the US, Pacific time. The problem with this approach is that the code will give inconsistent results (depending on the machine).
You can demonstrate this by running the snippet below in your browser (Chrome is best) and changing your machine timezone. You'll see that parsing the startDate (and endDate) would result in different times depending on your timezone.
So the combination of a timestamp and a timezone give us a clear, unambiguous point in time for the most robust code. If we don't set a timezone when parsing the start and end date, the code could give a different result depending on the machine it is running on.
The best approach is to specify what timezone the startDate and endDate are in, e.g. are they in IST, or in UTC?
This way you can be sure your dates will parse consistently.
I would also suggest creating a function, say, parseDate that accepts a datestring, a format, and a timezone. This is makes all assumptions clear to anyone who reads the code.
There is no issue with InitialDate or updateDate, since they are specified as UTC times (the Z timezone specifier), so they are both clear and unambiguous.
const dates = {
startDate: "2019-02-18",
endDate: "2020-02-16"
}
const startDateNoTimezoneSpecified = moment(dates.startDate);
console.log("StartDate (No Timezone Specified):", startDateNoTimezoneSpecified.toISOString());
function parseDate(dateString, format, timezone) {
return moment.tz(dateString, format, timezone)
}
// Parse start date, assuming it is in IST (I'm assuimg IST refers to India Standard Time , if it's Israel Standard Time replace with Asia/Jerusalem!
console.log("Parse date result (IST):", parseDate(dates.startDate, "YYYY-MM-DD","Asia/Kolkata").toISOString());
console.log("Parse date result (UTC):", parseDate(dates.startDate, "YYYY-MM-DD","UTC").toISOString());
// You can also use moment.utc instead of moment.tz(date, "UTC").. it's simpler!
const startDateUTC = moment.utc(dates.startDate);
console.log("StartDate (UTC (moment.utc)):", startDateUTC.toISOString());
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="https://momentjs.com/downloads/moment-timezone-with-data-1970-2030.js"></script>
You seem to be over complicating things.
Your conversion of UTC timestamps to local dates is OK, but the format doesn't make sense. MM-DD-YYYY is pretty useless for anything, I'd suggest using ISO 8601 YYYY-MM-DD.
Date-only timestamps should be treated as local, so no conversion is necessary for the second two dates. Using ISO 8601 format, the strings can be compared directly:
let initialDate = '2019-02-19T12:03:22.129Z';
let updateDate = '2019-02-28T05:26:57.115Z';
// Get local date in required format
let actualInitDatE = moment(initialDate || updateDate).format('YYYY-MM-DD');
// Use these as they are
let startDate = '2019-02-18';
let endDate = '2020-02-16';
if (actualInitDatE >= startDate &&
actualInitDatE <= endDate) {
console.log('Compared and True');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
You can also keep the values as moment objects after setting them to the start of the day and use various moment methods for comparison, but I think the string version is pretty simple so why make it harder than it has to be?
Whether "this code works across timeZones" is unknown as you haven't explained what you are actually trying to achieve.
var dts = "2019-05-26" // this value came from browser query like "d=1&date=2019-05-26"
var date = new Date(dts)
console.log(JSON.stringify(date))
which prints:
#=> "2019-05-25T19:00:00.0000Z"
Problem
I get this date from user input. Format only contains year, month and day. Problem happens when user browser's timezone applied on parsing. Sometimes, I get correct date in a day but sometimes i get one day before. This causes wrong database querying.
How can I convert this Date object to UTC? Because I need it as a Date object not as a string.
Is there any library that can help me parsing dates at UTC and get back as Date Object?
Use Moment UTC to normalize the time
I'm looking at a semi-old codebase where the following code is used to format a date in YYYY-MM-DD format according to a user's locale:
new Date('2000-01-01').toLocaleDateString(navigator.language)
However, this doesn't work in Firefox because new Date('2000-01-01') returns a datetime (time is 00:00) in UTC while toLocaleDateString uses the user's local timezone, so the above will return "December 31, 1999" for a user in the US.
What is the sane, safe way of doing this across browsers? Is it possible to do without one or more extra dependency?
If you add a timestamp to that date string it seems to be initialized with that time in the local timezone:
new Date('2000-01-01T00:00:00');
I tried this in both Chrome and Firefox and it seems to work as you want. However, creating a date with a string should be avoided as there's no guarantee it works consistently across different browsers. It's better to break the date into its parts, parse it as numeric values and initialize the date that way:
var dateParts = '2000-01-01'.split('-').map(Number);
new Date(
dateParts[0],
dateParts[1] - 1, // month is base 0
dateParts[2]
);
Update: Turns out Safari assumes UTC even if appending a timestamp to the date string, so this is one more reason to parse it and initialize the date with numeric values, as this always uses the local timezone.
I'm using moment.js and moment-timezone to get a local utc date string. I've created the function below to achieve this. When trying to use this when dealing with an Arabic locale I'm getting invalid date returned.
function _getLocalUtcDateString(utcDateString, timezoneId) {
var utcMoment = moment.utc(utcDateString, 'MM/DD/YYYY hh:mm:ss A').format('MM/DD/YYYY hh:mm:ss A');
var localTimeTz = moment.utc(utcMoment).tz(timezoneId).format('MM/DD/YYYY hh:mm:ss A');
return localTimeTz;
}
If I call it with the following parameters _getLocalUtcDateString("11/2/2016 4:45:47 PM", "America/New_York") and set moment.locale('ar') it fails with invalid date. The problem seems to be with utcMoment, when the lacale is Arabic this value equals ١١/٠٢/٢٠١٦ ٠٤:٤٥:٤٧ ص which is causing moment.utc(utcMoment).tz(timezoneId).format('MM/DD/YYYY hh:mm:ss A'); to fail.
If you open the console, you will see the following warning message:
Deprecation warning: value provided is not in a recognized ISO format. moment construction falls back to js Date(), which is not reliable across all browsers and versions. Non ISO date formats are discouraged and will be removed in an upcoming major release. Please refer to http://momentjs.com/guides/#/warnings/js-date/ for more info.
So the problem is the you are trying to parse a string that isn't in a recognized ISO format (see parsing docs for additional infos).
To fix the issue, you can simply remove the unnecessary format() in the first line of your function, as shown in the following working snippet:
function _getLocalUtcDateString(utcDateString, timezoneId) {
var utcMoment = moment.utc(utcDateString, 'MM/DD/YYYY hh:mm:ss A');
var localTimeTz = moment.utc(utcMoment).tz(timezoneId).format('MM/DD/YYYY hh:mm:ss A');
return localTimeTz;
}
moment.locale('ar');
var res = _getLocalUtcDateString("11/2/2016 4:45:47 PM", "America/New_York");
console.log(res);
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.16.0/moment-with-locales.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.7/moment-timezone-with-data-2010-2020.min.js"></script>