Hi guys I’m looking to write a javascript to change the date in the date box when I update the status select box.
For example the initial date on the datebox is 6/1/2021. And I will click on status rejected. The date should automatically change to today 6/3/21 without manually clicking the date picker box
JavaScript
x
16
16
1
<html>2
<body>3
4
<select>5
<option value="Offered">Offered</option>6
<option value="Accepted">Accepted</option>7
<option value="Rejected">Rejected</option>8
</select">9
10
<input type="date" id="date" name="date">11
<input type="submit" value="Submit">```12
13
14
</body>15
</html>16
Advertisement
Answer
I hope this answers your question. I have added comments for better clarity. In case you have any issues, let me know.
JavaScript
1
11
11
1
//Getting the select HTML node.2
const select = document.querySelector("#select");3
4
//Getting the date input node.5
const date = document.querySelector("#date");6
7
//Adding a change event listener to the select node.8
select.addEventListener('change', () => {9
//Had to use ISOString with slice method, since the date picker only accepts the date value in "yyyy-MM-dd" format.10
date.value = new Date().toISOString().slice(0, 10);11
});JavaScript
1
13
13
1
<html>2
<body>3
4
<select id="select">5
<option value="Offered">Offered</option>6
<option value="Accepted">Accepted</option>7
<option value="Rejected">Rejected</option>8
</select>9
10
<input type="date" id="date" name="date">11
<input type="submit" value="Submit">12
</body>13
</html>