Question 43289 in Html Question posted in
Some basic documentation can be found here.

how to set the value of an html input of the type datetime-local using a JavaScript Date object

Using JavaScript it is not easy to set the value of an html input of the type datetime-local.

input.valueAsNumber

document.getElementById("dateInput").valueAsNumber = new Date("Thu Mar 30 2023 12:54:17 GMT+0000 (UTC)").valueOf();

The following does not work unless you happen to be in the UTC timezone. valueAsNumber accepts a numeric representation of the datetime but it doesn’t convert the UTC numeric representation to the local timezone.

input.valueAsDate

document.getElementById("dateInput").valueAsDate = new Date("Thu Mar 30 2023 12:54:17 GMT+0000 (UTC)");

The following returns "Uncaught DOMException: Failed to set the ‘valueAsDate’ property on ‘HTMLInputElement’: This input element does not support Date values."

input.value

document.getElementById("dateInput").value = "Thu Mar 30 2023 12:54:17 GMT+0000 (UTC)";

The following returns "The specified value "Thu Mar 30 2023 12:54:17 GMT+0000 (UTC)" does not conform to the required format. The format is "yyyy-MM-ddThh:mm" followed by optional ":ss" or ":ss.SSS""

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0 
    let date = new Date("Thu Mar 30 2023 12:54:17 GMT+0000 (UTC)");
    
const formatDate = (date) => {
      return date.getFullYear() + "-" + (date.getMonth()+1).toString().padStart(2, '0') + "-" + date.getDate() + "T" + date.getHours().toString().padStart(2, '0') + ":" + date.getMinutes().toString().padStart(2, '0');
}

document.getElementById("dateInput").value = formatDate(date);

    The following is how this would be accomplished. I posted this question/answer to save someone else the trouble of getting to this solution.


  2. 0

    If you are to use the output of Date.prototype.toString, then you should parse the string and create a timestamp that suits your purpose. Only the month name needs to be converted to a number, the rest of what you need is in the string without modification.

    See Date.toISOString() but local time instead of UTC to use a Date object directly.

    Below is an example of parsing the output of Date.prototype.toString and reformatting it.

    /* Reformat timestamp in Date#toString format to ISO 8601 local
 * i.e. without offset.
 *
 * @param {string} s - timestamp in ddd MMM DD YYYY HH:mm:ss format
 *                     default is current date
 * @returns {string} timestamp reformatted as YYYY-MM-DDTHH:mm:ss
 */
function reformatDateAsISO(s = new Date().toString()) {
  let pad = n => (n < 10? '0':'') + n;
  let months = [,'Jan','Feb','Mar','Apr','May','Jun',
                 'Jul','Aug','Sep','Oct','Non','Dec'];
  let [day, mon, date, year, time, rest] = s.split(' ');
  return `${year}-${pad(months.indexOf(mon))}-${date}T${time}`;
}

["Thu Mar 30 2023 12:54:17 GMT+0000 (UTC)",
 new Date().toString()
].forEach(s => console.log(s + 'n' + reformatDateAsISO(s)));
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search