Setting HTML date input value

How to set the default value to a HTML date input using vanilla JS or jQuery, including a method to set the date to be 1 month from now.

setting HTML date input value

The date input element:

<input type="date" id="todaysDate" name="todaysDate">

Full example and code.

Setting the value to be today’s date with vanilla JS:

document.getElementById("todaysDate").valueAsDate = new Date();

Custom date with jQuery:

$("#customDate").val("2004-08-15");

Or setting a custom date such as one month from today’s date:

var the_date = new Date();
the_date.setMonth(1);
var yyyy = new Intl.DateTimeFormat("en", { year: "numeric" }).format(the_date);
var mm = new Intl.DateTimeFormat("en", { month: "2-digit" }).format(the_date);
var dd = new Intl.DateTimeFormat("en", { day: "2-digit" }).format(the_date);
var one_month_on = `${yyyy}-${mm}-${dd}`;

$("#oneMonth").val(one_month_on);

setMonth(1) is for setting the date to 1 month in advance. setMonth(6) would be 6 months advanced.