limited the input of date to specific range in javascript

user_4332309 0
Viewed 710

I have a list of different dates, in this format YYYYMMDD. and I have an input field type date as below, HTML and Javascript. I used a method by Jquery datePicker but I have not reached a solution yet. I prefer to use standard HTML and Javascript.

<input type="date" id="selDate" placeholder="e.g. 20180925">

My question is that I want to update this input date calender and highlighted multiple days based on the different date given so the user will be allowed to pick days within the given list of date.

so based on the below dates example, the user should only able to pickup those dates.

20180510 20161209

Thanks

calendar date input html javascript
1 Answers

You can use min, max parameters to limit the selectable range of dates:

<input type="date" id="selectedDate" min="2016-12-09" max="2018-05-10">

You can also "replace" the date picker with a list:

<input type="date" id="selectedDate" name="date" list="datesList">

<datalist id="datesList">
    <option label="Day one">2016-12-09</option>
    <option label="Day two">2018-05-10</option>
</datalist>

user_124404030
Related