Set the Values of Input type Date and Time using JavaScript | bobbyhadz
Fri Sep 09 2022 16:00:42 GMT+0000 (Coordinated Universal Time)
Saved by
@luiso
#javascript
const [date, time] = formatDate(new Date()).split(' ');
console.log(date); // ποΈ 2021-12-31
console.log(time); // ποΈ 09:43
// β
Set Date input Value
const dateInput = document.getElementById('date');
dateInput.value = date;
// ποΈοΈ "2021-12-31"
console.log('dateInput value: ', dateInput.value);
// β
Set time input value
const timeInput = document.getElementById('time');
timeInput.value = time;
// ποΈ "09:43"
console.log('timeInput value: ', timeInput.value);
// β
Set datetime-local input value
const datetimeLocalInput = document.getElementById('datetime-local');
datetimeLocalInput.value = date + 'T' + time;
// ποΈ "2021-12-31T10:09"
console.log('dateTimeLocalInput value: ', datetimeLocalInput.value);
// ποΈποΈποΈ Format Date as yyyy-mm-dd hh:mm:ss
// ποΈ (Helper functions)
function padTo2Digits(num) {
return num.toString().padStart(2, '0');
}
function formatDate(date) {
return (
[
date.getFullYear(),
padTo2Digits(date.getMonth() + 1),
padTo2Digits(date.getDate()),
].join('-') +
' ' +
[
padTo2Digits(date.getHours()),
padTo2Digits(date.getMinutes()),
// padTo2Digits(date.getSeconds()), // ποΈ can also add seconds
].join(':')
);
}
// ποΈ 2022-07-22 08:50:39
console.log(formatDate(new Date()))
// ποΈ 2025-05-04 05:24
console.log(formatDate(new Date('May 04, 2025 05:24:07')))
content_copyCOPY
https://bobbyhadz.com/blog/javascript-set-values-input-date-time
Comments