How to get current formatted date dd/mm/yyyy in Javascript and append it to an input

Question

I would like to add a current date to a hidden HTML tag so that it can be sent to the server:

<input type="hidden" id="DATE" name="DATE" value="WOULD_LIKE_TO_ADD_DATE_HERE">

How can I add a formatted date to the VALUE attribute?

First thing: don't mix Java with Javascript (don't even split the words Java and Script!). They are completely different languages. — Gilberto Torrezan, Sep 13 '12 at 15:07
Do you need the client's local date? Could be an option to use the server's date? — gparis, Sep 13 '12 at 15:11
`(new Date()).toLocaleDateString('en-GB')` is literally all you need to get the UK format date as per OP's question. — BadHorsie, Aug 01 '18 at 17:26
Don't do this. The server knows the current date and time and should not trust the value sent by the client because it is trivial to modify the value of a hidden input. — Paul, Apr 15 '23 at 15:46

score 694 · Accepted Answer · edited Jul 10 '22 at 10:44

694

I hope this is what you want:

const today = new Date();
const yyyy = today.getFullYear();
let mm = today.getMonth() + 1; // Months start at 0!
let dd = today.getDate();

if (dd < 10) dd = '0' + dd;
if (mm < 10) mm = '0' + mm;

const formattedToday = dd + '/' + mm + '/' + yyyy;

document.getElementById('DATE').value = formattedToday;

How do I get the current date in JavaScript?

edited Jul 10 '22 at 10:44

shareef

9,255
13
58
89

answered Sep 13 '12 at 15:06

Aelios

11,849
2
36
54

15

For most uses, replace the last line with "return today;" – sitesbyjoe Dec 01 '14 at 22:26
37

This is helpful, but confirms that Javascript is insanely inefficient at getting a formatted date returned. It's unfathomable to have to write more than one line of code to do this... – jlbriggs Sep 11 '15 at 13:26
210

`new Date(Date.now()).toLocaleString();` – Oded Breiner Jul 18 '16 at 17:15
@WhereDatApp.com Is this solution work cross browsers? – Abdalla Arbab Aug 11 '17 at 12:41
2

http://caniuse.com/#search=toLocaleString() @abdallaarbab – Oded Breiner Aug 12 '17 at 06:44
is there any js frameworks which has good date api support ? – Sumanth Varada Apr 27 '18 at 10:31
2

new Date().toJSON().slice(0,10).split('-').reverse().join('/') works good for me. – Sasikumar May 21 '18 at 09:28
28

date.toLocaleDateString('en-GB') – Sakshi Nagpal Jun 24 '18 at 17:43
Reuse of variable 'today' this way is not a good practise – Rauli Rajande Nov 14 '18 at 21:29
@SumanthVarada you can have a look at momentjs here: https://momentjs.com/ – Gel Dec 04 '18 at 18:51
38

`new Date(Date.now()).toLocaleString().split(',')[0]` for the current date in dd/mm/yyyy format only. – Andrew Hill Jun 28 '19 at 08:24
new Date(Date.now()).toLocaleString().slice(0,10); – BennKingy Dec 15 '19 at 18:33
3

`new Date(Date.now()).toLocaleString();` this gives different formatting results for safari and chrome. Do check before using it. – Niraj Jan 23 '20 at 13:23
new Date().toJSON().slice(0,10) – Shashwat Gupta Mar 26 '20 at 19:17
2

new Date().toLocaleDateString() this will give date in this format "04/04/2020" – Shablcu Apr 04 '20 at 10:56
var DATE_NOW = DATE('d','m','y','-') function DATE(a,b,c,e){ var d = new Date(Date.now()).toLocaleString().split(',')[0]; d = d.split('.'); var as = { d:d[0] ,m:d[1] ,y:d[2] }; return as[a]+e+as[b]+e+as[c]; } – Роман Зыков Sep 18 '20 at 13:26
Oded's answer is so much shorter than importing a library with 5697 lines of code – Oba Api May 30 '22 at 07:39
new Date(Date.now()).toLocaleString().replace(/(.*?)\/(.*?)\/(.*?),.*$/,"$3-$2-$1") – Wasim A. Nov 11 '22 at 17:59
Use `Number(2).toString().padStart(2, 0)` for leading zeros – Daniel Katz Feb 27 '23 at 10:38

score 248 · Answer 2 · edited Feb 05 '18 at 21:55

248

I honestly suggest that you use moment.js. Just download moment.min.js and then use this snippet to get your date in whatever format you want:

<script>
$(document).ready(function() {

     // set an element
     $("#date").val( moment().format('MMM D, YYYY') );

     // set a variable
     var today = moment().format('D MMM, YYYY');

});
</script>

Use following chart for date formats:

enter image description here

edited Feb 05 '18 at 21:55

Chris Boylan

314
4
15

answered Apr 03 '14 at 06:30

Ali

5,021
4
26
45

1

simple and effective solution to all date display problems in JavaScript – Jakki Jun 09 '16 at 11:26
1

I will definitely use moment.js from now on. Very easy and very effective to use. @Ali thanks a lot. – FrenkyB Jul 06 '16 at 11:59
2

You can parse dates like this: moment('26/04/2016', 'DD/MM/YYYY').format('YYYY-MM-DD'); – WoodyDRN Oct 04 '16 at 22:01
can moment get date like "3rd friday of sept"? – tatmanblue May 22 '17 at 21:42
@tatmanblue Yeah you can. moment().format('Do dddd of MMMM') If you don't want it to show the full day or month name, then you can cut it down from 4 d's or M's to 3 instead. – Kevin Østerkilde Jun 19 '17 at 15:49
42

btw moment.js is NOT a small library – Murhaf Sousli Oct 07 '17 at 09:48
1

new Date().toJSON().slice(0,10).split('-').reverse().join('/') works good for me. – Sasikumar – Sasikumar May 21 '18 at 09:28
4

For those who want similar functionality with a smaller footprint, Day.js is excellent! https://www.npmjs.com/package/dayjs – Lewis Donovan Jul 29 '19 at 16:06
hey jQuery, how have you been – Alexey Shevelyov May 20 '20 at 18:04
I find avoiding large packages on client is better. I'm currently weening off Moment for custom Date() code – GaddMaster Sep 28 '21 at 21:28
Even *the people who make Moment* are recommending you switch to a different library. – machineghost Aug 30 '22 at 19:10

score 150 · Answer 3 · answered Sep 29 '13 at 14:53

150

<input type="hidden" id="date"/>
<script>document.getElementById("date").value = new Date().toJSON().slice(0,10)</script>

answered Sep 29 '13 at 14:53

Varun Natraaj

7,402
2
18
19

49

d.toJSON().slice(0,10).split('-').reverse().join('/') – Gaurav Mar 22 '17 at 14:07
Quickest way to do it without external libraries. Very good. – TCN Apr 25 '17 at 12:45
14

An alternative to @Gaurav's solution for those of us who need the date in ISO fomat: `new Date().toJSON().slice(0,10).replace(/-/g,'/')` – TCN Apr 25 '17 at 12:48
this should be the accepted answer – Rid Iculous Aug 24 '17 at 04:34
6

new Date(Date.now()).toLocaleString().split(',')[0] – Pranav Singh Sep 01 '17 at 10:17
3

date.toLocaleDateString('en-GB'); – Sakshi Nagpal Jun 24 '18 at 17:43
1

So far the coolest – somejhereandthere Sep 15 '18 at 23:35
20

to format in dd/mm/yyyy `new Date().toJSON().slice(0,10).split('-').reverse().join('/')` – Hassan ALAMI Jan 10 '19 at 08:28
This is the slickest date format method I have ever seen. – rolinger Apr 04 '19 at 12:10
This is so ugly, but it seems to be the best you can do with vanilla JS. +1 – Jules Colle Apr 18 '20 at 15:07
Why `toJSON` insteadof `toISOString`? – Илья Зеленько Jul 30 '20 at 17:45
do not fall for `toLocaleString` its always based on current system settings, tests will fail every region. – STEEL Mar 04 '21 at 07:52

score 4 · Answer 4 · edited May 23 '17 at 12:02

4

To get current date/time in javascript:

var date = new Date();

If you need milliseconds for easy server-side interpretation use

var value = date.getTime();

For formatting dates into a user readable string see this

Then just write to hidden field:

document.getElementById("DATE").value = value;

edited May 23 '17 at 12:02

Community

1
1

answered Sep 13 '12 at 15:13

Wutz

2,246
13
15

or just `document.getElementById('DATE').value = (new Date()).getTime();` – jbyrd May 07 '18 at 10:46
5

new Date().toJSON().slice(0,10).split('-').reverse().join('/') works good for me. – Sasikumar May 21 '18 at 09:28

score 2 · Answer 5 · answered Sep 13 '12 at 15:08

2

By using the value attribute:

var today = new Date();
document.getElementById('DATE').value += today;

answered Sep 13 '12 at 15:08

Asciiom

9,867
7
38
57

score 1 · Answer 6 · answered Sep 13 '12 at 15:07

Use the DOM's getElementByid method:

document.getElementById("DATE").value = "your date";

A date can be made with the Date class:

d = new Date();

(Protip: install a javascript console such as in Chrome or Firefox' Firebug extension. It enables you to play with the DOM and Javascript)

score -1 · Answer 7 · answered Sep 13 '12 at 15:06

-1

You edit an element's value by editing it's .value property.

document.getElementById('DATE').value = 'New Value';

answered Sep 13 '12 at 15:06

gen_Eric

223,194
41
299
337

How to get current formatted date dd/mm/yyyy in Javascript and append it to an input

7 Answers7

Linked

Related