formatting jQuery date object 'Date Feb 14 2019 | 20:02'

Question

var dt = new Date();
var mmddyyyy = dt.getMonth() + ":" +  dt.getDay() + ":" + dt.getYear();
var time = dt.getHours() + ":" + dt.getMinutes();

$('#elem').html(mmddyyyy  + time);

I'm trying the above in order to simply format ''Date Feb 14 2019 | 20:02'

But sadly it is outputting like:

1:5:11916:4

Possible duplicate of [Formatting the date time with Javascript](https://stackoverflow.com/questions/8847109/formatting-the-date-time-with-javascript) — Erik Philips, Feb 15 '19 at 21:14

Rory McCrossan · Accepted Answer · 2019-02-15T21:17:33.433

There's several problems here. Firstly getMonth() returns the zero-based index of the month of the date. To turn that in to a short name string of the month you can define your own array which you can access by index based on that value.

You're then using getDay() which returns the current day of the week. I presume you want getDate() instead which gives you the current day of the month. Then you'll need getFullYear() to get a four-digit year value, instead of getYear().

Finally, with the times you will need to pad the leading zeros on the hours and minutes before concatenating them to the final output string.

With all that said, try this:

var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

var dt = new Date();
var mmddyyyy = months[dt.getMonth()] + ' ' +  dt.getDate() + ' ' + dt.getFullYear();

var time = ('00' + dt.getHours()).slice(-2) + ":" + ('00' + dt.getMinutes()).slice(-2);

$('#elem').html(mmddyyyy + ' | ' + time);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="elem"></div>

If you require any further modifications to this I'd suggest reading the Date() object reference at MDN. It's covers all methods available for date formatting.

formatting jQuery date object 'Date Feb 14 2019 | 20:02'

1 Answers1