2

For an input date of “23-SEP-2021 00:00” we're getting output of September 22, 2021, but for

“17-SEP-2021 00:00:00" it returns September 17, 2021.

Code looks like this:

export const formatDate = (date) => {
  return dayjs(date).format('MMMM DD, YYYY');
};

I've been looking at dayjs format, and I'm not sure what is causing this. I suspect it's either my input month is abbreviated (but probably not since both use SEP), or the different digits in the time (00:00 vs 00:00:00). Searching online I can't find confirmation that it's the time digit difference. Any ideas, or why it would be the time part?

Update: I'm trying to use jsfiddle or chrome console to try this out so I don't have to modify the whole web page to see what changes would do. I tried codePen Playground, but I don't think I'm seeing how to run it there. I also tried at the chrome dev console as shown but got errors that I'm not sure how to fix:

>dayjs(“17-SEP-2021 00:00:00" ).format('MMMM DD, YYYY');
Uncaught SyntaxError: Cannot use import statement outside a module
>require('dayjs')
Uncaught ReferenceError: require is not defined
    at <anonymous>:1:1

Trying a snippet, it's giving error regarding dayjs not being defined. I must be doing something wrong. I used this example, but the example didn't give info on how to include dayjs. I have dayjs in there, but for some reason it's only showing when I edit the question.

//var date = new Date("23-SEP-2021 00:00");
//date = date.toLocaleTimeString('en-US', {timeZone: 'America/New_York'});
//console.log(date);
//console.log(dayjs(date).format('MMMM DD, YYYY'));
console.log(dayjs("2021-09-23T00:00:00-04:00").format('MMMM DD, YYYY'));
<script src="https://cdn.jsdelivr.net/npm/dayjs@1.10.7/dayjs.min.js" integrity="sha256-DLRq9d+sak+DFd9tNntiDhbit2Ap2DBlVfh7l9o+LNM=" crossorigin="anonymous"></script>

Update2: Looking at module, it seems like this might be applicable but I can't figure out how to use it with my snippet. Any ideas?

Update3: Added to the snippet trying to add time zone but making the date string into time zone, is returing time instead of date, which dayjs doesn't like. How do I format this with time zone?

Michele
  • 3,617
  • 12
  • 47
  • 81
  • Try using [Stack Snippets](https://meta.stackoverflow.com/q/358992/215552) (button with `<>` in the toolbar). You'll need a CDN link to dayjs. In any case, it's probably the parsing of the original date, not the formatting. – Heretic Monkey Sep 24 '21 at 17:36
  • There's nothing different between what happens between getting date from db (for each date of the two fields), and when it gets to the formatting. I'm sure we could format differently coming out of the db, but I want to figure out if the extra 00 is the issue. – Michele Sep 24 '21 at 19:12
  • I suggest formatting them using ISO 8601 (i.e., yyyy-MM-ddTHH:mm:ssZ), where Z is either a literal Z, if you've stored the dates without time and are prepared to use UTC across the board, or nothing, if you just want to use local time (which could be what is causing your problem). – Heretic Monkey Sep 24 '21 at 19:22
  • When I put in the dates, 17th and 23rd, in the snippet, it's giving the correct output, so I'm surprised it doesn't recreate in the snippet. The times are 00:00 or 00:00:00. @HereticMonkey, is your second suggestion to remove the time portion entirely since it's 00's anyway? – Michele Sep 27 '21 at 16:31
  • @HereticMonkey I tried adding time zone in the snippet, but it's returning time instead of datetime. Any idea how to convert the date to add time zone? It's definitely all 00:00's in the time, but I think time zone is the issue. – Michele Sep 28 '21 at 12:28
  • You can't parse that format by passing the string to the `Date` constructor. Please read the answers to [Why does Date.parse give incorrect results?](https://stackoverflow.com/q/2587345/215552) and [Is the Javascript date object always one day off?](https://stackoverflow.com/q/7556591/215552) – Heretic Monkey Sep 28 '21 at 12:36
  • I'm trying to format my date from the db side and dayjs seems to take the format with -4:00, so hopefully it will correct the issue. The snippet isn't showing the date changing to the previous day for some reason (with original date time) like the code does. https://stackoverflow.com/questions/69362056/how-convert-time-in-query-and-add-time-zone-date-format-not-recognized/69362456?noredirect=1#comment122598857_69362456 – Michele Sep 28 '21 at 14:58

0 Answers0