Disable certain dates from html5 datepicker

Seeya K picture Seeya K · Jun 19, 2013 · Viewed 92.7k times · Source

Is it possible to disable dates when I use I want to disable current date for one scenario and future dates for other scenario. How should I disable the dates?

Answer

Blazemonger picture Blazemonger · Oct 8, 2013

You can add a min or max attribute to the input type=date. The date must be in ISO format (yyyy-mm-dd). This is supported in many mobile browsers and current versions of Chrome, although users can manually enter an invalid date without using the datepicker.

<input name="somedate" type="date" min="2013-12-25">

The min and max attributes must be a full date; there's no way to specify "today" or "+0". To do that, you'll need to use JavaScript or a server-side language:

var today = new Date().toISOString().split('T')[0];
document.getElementsByName("somedate")[0].setAttribute('min', today);

http://jsfiddle.net/mblase75/kz7d2/

Ruling out only today, while allowing past or future dates, is not an option with here. However, if you meant you want tomorrow to be the min date (blanking out today and all past dates), see this question to increment today by one day.

As in all other cases involving HTML forms, you should always validate the field server-side regardless of how you constrain it client-side.