How to format timestamp to a calendar format date? - javascript

I'm using devExtreme dxScheduler and i'm trying to display meetings after fetching them from api, the problem is that i can't recreate the original date format ("YYYY-MM-DDThh:mm:ssZ") since i'm getting the dates as timestamp.
Here is how it's stores :
var startDate = moment("2021-05-24T16:30:00.000Z").valueOf()
// 1621873800000
Here is what i'm trying to do to recreate the format:
var startDate = moment(new Date(startDate)).format("YYYY-MM-DDThh:mm:ssZ")
//"2021-05-24T07:30:00+03:00"
Notice that the original date ("2021-05-24T16:30:00.000Z") and the formatted date ("2021-05-24T07:30:00+03:00") are different ...hence the calendar do not displays them.

Looks like the date is being converted into your local timezone, thus the difference. You may need to add Moment Timezone to be able to get the timezone back in to recreate it to the format you need. Also consider adding utc() before the format to bring it to Zulu time.

Fix 1
I see from the DevExtreme page that it needs to be displayed within this format:
currentDate: new Date(2021, 4, 27)
Maybe you need to format it before adding it like this:
var check = moment("2021-05-24T16:30:00.000Z", 'YYYY/MM/DD');
var month = check.format('M');
var day = check.format('D');
var year = check.format('YYYY');
console.log(month,day,year);
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
And then in your dxScheduler add the property like this:
currentDate: new Date(year, month, day);
Fix 2
If that's not the problem, you can install moment-timezone
var a = moment.utc("2013-11-18 11:55").tz("Asia/Taipei");
var b = moment.utc("2013-11-18 11:55").tz("America/Toronto");
a.format(); // 2013-11-18T19:55:00+08:00
b.format(); // 2013-11-18T06:55:00-05:00
a.utc().format(); // 2013-11-18T11:55Z
b.utc().format(); // 2013-11-18T11:55Z
In this example, you first create moment.utc("2013-11-18 11:55") object in UTC, and then change its timezone to specified. This also works if you create the object in your default timezone: moment("2013-11-18 11:55").
Note that created moments have equal UTC time because these moments were created in a default timezone.

Turns out that displaying a calendar event with DevExtreme requires only to use regular date object.... so no need to do anything spacial.

Related

How to get the current time to an existing date in JavaScript?

I'm trying to add the current time to an existing date but I'm not sure how to do it.
I'm importing stuff into a Postgres database and need a ISO string to update the "updatedAt" column, the imported stuff only has a date like this tho: "2022-03-15", no time.
How would I add the time to this and turn it into a proper ISO string for my database?
const date = new Date('2022-03-15')
const iso = date.toISOSTring() // how to add the current time?
-
Should look like this: "2022-03-15 09:36:54.292613"
Thank you! :)
Try to use dayJs and add the time that you need, https://day.js.org/docs/en/parse/string
dayjs('2018-04-04T16:00:00.000Z')
dayjs('2018-04-13 19:18:17.040+02:00')
dayjs('2018-04-13 19:18')
You can set the time units into date from the current date-time i.e. new Date().
const date = new Date("2022-03-15");
const now = new Date();
date.setHours(now.getHours());
date.setMinutes(now.getMinutes());
date.setSeconds(now.getSeconds());
date.setMilliseconds(now.getMilliseconds());
console.log(date.toISOString());
console.log(date.toISOString().replace("T", " ").replace("Z", " "));

Luxon substracting one day if JS date is UTC

I create a date with Luxon in the following way:
const date = DateTime.utc(2000, 6, 23).toFormat('yyyy-MM-dd')
Then I try to convert it to a JS date by doing this:
const jsDate = new Date(date)
Finally, I convert it back to the 'yyyy-MM-dd' format with
const parsedDate = DateTime.fromJSDate(jsDate).toFormat('yyyy-MM-dd')
But instead of giving me 2000-06-23 it gives me 2000-06-22. Is this a bug on Luxon or I need to do something to get the correct date?
I try to convert it to a JS date by doing const jsDate = new Date(date)
Uh, why not just date.toJSDate()?
Instead of giving me 2000-06-23, DateTime.fromJSDate(jsDate).toFormat('yyyy-MM-dd') gives me 2000-06-22. Is this a bug on Luxon or I need to do something to get the correct date?
According to its docs, fromJSDate defaults to creating a DateTime instance in the local (system) timezone. If you expect another UTC date back, you need to specify that:
DateTime.fromJSDate(jsDate, {zone: 'utc'}).toFormat('yyyy-MM-dd')

How do I get the next day's date in JS in YYYY-MM-DD format?

Seems like a simple question, but all the timezone ins and outs in JS are causing me a bunch of headaches.
Basically, if I have a date like the following:
2018-04-06
I want to be able to get the next day's date as such:
2018-04-07
I found the following snippet on SO for doing this (kind of):
var date = new Date('2018-04-06');
date.setDate(date + 1);
The problem is that I'm getting the date back with the adjusted timezone, and because I'm in the US ET timezone, it's giving me that date minus five hours, which is actually the same day as where I started.
I've been through countless SO posts trying to find an answer to this seemingly simple question, but for any given date, regardless of the timezone the user is in, how do I get the next day's date in YYYY-MM-DD format? Thank you.
Strings in the format YYYY-MM-DD are parsed as UTC so in this case, do everything in UTC (see Why does Date.parse give incorrect results? and How can I add 1 day to current date?).
The toISOString method will return the string in the required format, just trim the redundant time part, e.g.
let s = '2018-04-06';
let d = new Date(s);
d.setUTCDate(d.getUTCDate() + 1);
console.log(d.toISOString().substr(0,10));
Did you try with the UTC date?
var date = new Date('2018-04-06');
console.log(date.toUTCString());
date.setDate(date.getDate() + 1);
console.log(date.toUTCString());
As it was suggested by #chrisbyte, have your tried to use toUTCString method instead of toString() method ?
As a reminder , toString is the default used when you display the date object withim the console for example
I think the "problem" you're assuming is just an incomplete understanding how Date.toString() method behaves: this method seems to to return string representing a Date object but seems to use timezone as mentionned here (on the comment in 1st example)
Here my snippet to understand more:
const originalDate = new Date('2018-04-06');
// retrieving the original timestamp
const originalTimestamp = originalDate.valueOf()
// displaying the original date (non UTC / UTC)
console.log(`original date (timezone dependent): ${originalDate.toString()}`)
console.log(`original date (timezone independent): ${originalDate.toUTCString()}`)
// we add one more day
originalDate.setDate(originalDate.getDate() +1)
const dayAfterTimestamp = originalDate.valueOf()
// displaying the original date (non UTC / UTC)
console.log(`updated date (timezone dependent): ${originalDate.toString()}`)
console.log(`updated date (timezone independent): ${originalDate.toUTCString()}`)
// check the differences (in milliseconds)
console.log(`difference: ${(dayAfterTimestamp-originalTimestamp)}`)
// displaying the original format (timezone independent)
At last if you want to return the date string as a YYYY-MM-DD format you may have to implement it yourself :-/ , or use toLocaleFormat method but it isn't standardized.
The logic would be to add 24 hours in milliseconds to the current time. As an example:
var myDate = new Date();
var oneMoreDay = new Date();
oneMoreDay.setTime(myDate.getTime() + 86400000);
console.log(myDate.getDate());
console.log(oneMoreDay.getDate());
An additional day has been added to the oneMoreDay variable. In your specific example you just wanted to add one more day to the ORIGINAL variable, so i'd do something such as:
date.setTime(date.getTime() + 86400000);

moment js change the date portion of a datetime

Using the moment.js library say i have a datetime with today's date and i would like to replace only the date part of the datetime with another value and keep the time portion the same
I don't want to subtract or add days etc - i have a 3rd party time picker that when you select a time it creates a datetime that is always the current day. I need to send back to server a different datetime - the date is different but keep the time portion from the picker.
example code:
let myDate = "2019-03-15T00:00:00"
let selectedDateTime = "2019-04-04T12:30:00"
expected result would be:
"2019-03-15T12:30:00"
Thank you
The following should solve your problem:
let myDate = moment("2019-03-15T00:00:00")
let selectedDateTime = moment("2019-04-04T12:30:00")
selectedDateTime.date(myDate.date());
selectedDateTime.month(myDate.month());
selectedDateTime.year(myDate.year());
As #JeremyThille suggested, you should take a look at the documentation.

JavaScript date displaying the wrong day and time

I have this application where I want to use you date, but the problem is that the date is not working as I expect.
I create a date object like this:
// Get today's date
today: function () {
// Create a new date
var date = new Date();
// Set to midnight
date.setHours(0, 0, 0, 0);
// Return our date
return date;
},
and If I output that date in my view I get yesterdays date at 23:00 hours....
Which looks like this:
2015-07-08T23:00:00.000Z
Does anyone know how I can get the date to be formatted properly?
Update
Just to elaborate a bit, I want to use the date to compare against records in the database. These records have the date applied to them, because the JavaScript is showing the local date time, it is not comparing correctly. Also there is a case where I am saving that date and I don't want it to save the local date.
based on your culture setting you can use the
date.toLocaleDateString()
this will give localized string format back
date.toUTCString();
date.toLocaleString();
date.toLocaleDateString();
date.toDateString();
date.toISOString();
Find your answer here :) And the best option is to use momentjs http://momentjs.com/
So, I ended up creating this function:
// Converts a date to a timeStamp
this.convertToTimeStamp = function (dateTime) {
// Get just the date
var date = dateTime.toDateString();
// Get the timestamp
var timeStamp = Date.parse(date);
// Return our timeStamp
return timeStamp;
};
If my understanding is correct, that should create the same date no matter what timezone / locale you are in.

Categories

Resources