Disable certain dates from html5 datepicker

by

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.

More Related Contents:

  1. Is there any way to change input type=”date” format?
  2. Are there any style options for the HTML5 Date picker?
  3. Implement an input with a mask
  4. How to set input type date’s default value to today?
  5. How to set date format in HTML date input tag?
  6. Disable native datepicker in Google Chrome
  7. How to set default value to the input[type=”date”] [duplicate]
  8. Not showing placeholder for input type=”date” field
  9. Remove default text/placeholder present in html5 input element of type=date
  10. Can I use an HTML input type “date” to collect only a year?
  11. Do checkbox inputs only post data if they’re checked?
  12. How to center elements on the last row in CSS Grid?
  13. Maintain aspect ratio of div but fill screen width and height in CSS?
  14. CSS: Control space between bullet and
  15. Select dropdown with fixed width cutting off content in IE
  16. href overrides ng-click in Angular.js
  17. How do I create an HTML button that acts like a link?
  18. How to draw circle in html page?
  19. How to horizontally align ul to center of div?
  20. Html code as IFRAME source rather than a URL
  21. Form inside a form, is that alright? [duplicate]
  22. How to position a div scrollbar on the left hand side?
  23. How to add hamburger menu in bootstrap
  24. How to vertically center a inside a div? [duplicate]
  25. body { overflow-x: hidden; } breaks position: sticky
  26. Bad value X-UA-Compatible for attribute http-equiv on element meta
  27. Html.BeginForm() with an absolute URL?
  28. iPad layout scales up when rotating from portrait to landscape
  29. How to make input autofocus in internet explorer?
  30. Image center align vertically and horizontally [duplicate]

Leave a Comment