I am using HTML's <input type='date'>. The year it displays by default is 2021. However, I want people who is at least 13 years old to be able to access my app. Therefore, I want to modify the date in such a way that it always displays the default year as 13 years back and that should also be the last year to select from. For example, as we are in 2021 so people born no later than 2008 should be able to join. So the last year to be shown should be 2008 and this should increase every year automatically. I could do it easily if I had used jQuery datepicker but I am happy with HTML's default input type date option.
Asked
Active
Viewed 1,068 times
0
Relaxing Music
- 452
- 4
- 13
-
[Set date input field's max date to today](https://stackoverflow.com/q/32378590/215552), [Disable certain dates from html5 datepicker](https://stackoverflow.com/q/17182544/215552), [How can I use input type date to dynamically only allow for one year from current date?](https://stackoverflow.com/q/58191201/215552) – Heretic Monkey Jul 17 '21 at 18:39
1 Answers
0
You can set the max date to 13 years before the current date programmatically by getting the current date (via the Date() constructor), setting the year to the current year - 13 and assigning it to the max property:
const d = new Date();
d.setYear(d.getFullYear() - 13);
date.max = d.toISOString().split("T")[0]; //this simply converts it to the correct format
date.value = d.toISOString().split("T")[0];<input type="date" id="date">
Spectric
- 30,714
- 6
- 20
- 43
-
-
@RelaxingMusic What do you mean? It disables all days less than 13 years ago. – Spectric Jul 17 '21 at 18:35
-
1@Spectric You have to set the `value` to the same date, or the user has to page back 13 years of dates. – Heretic Monkey Jul 17 '21 at 18:41
-
@HereticMonkey Thanks. Chrome apparently already sets the current date to the `max` property, which is why I didn't notice. – Spectric Jul 17 '21 at 18:43