HTML5 input type date disable dates before today

Question

Is there a way to disable dates before today in HTML5?

<input type="date">

I tried this

<input type="date" min="<?php echo $today; ?>"> 

but this works only on desktop browsers... safari mobile still allow dates prior to today.

Answer 1

Input date must be in ISO format (which is supported by mobile browsers).

There is no possible way to do this with pure HTML5 .

But with Javascript, you can do something like:

<input name="setTodaysDate" type="date">

and;

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

This little script will change the min with today's date in ISO format.

Live example here: jsFiddle

Answer 2

 var today = new Date(); var dd = today.getDate(); var mm = today.getMonth() + 1; //January is 0! var yyyy = today.getFullYear(); if (dd < 10) { dd = '0' + dd } if (mm < 10) { mm = '0' + mm } today = yyyy + '-' + mm + '-' + dd; document.getElementById("datefield").setAttribute("max", today);

 <input id="datefield" type='date' min='1899-01-01' max='2000-13-13'></input>

Answer 3

如果您使用的是 PHP，那就太容易了

<input class="form-control" type="month" min="<?php echo date('Y'); ?>" name="ex_rate_date" required>

Answer 4

你可以试试这个：

<input type="date" name="bday" min="<?= date('Y-m-d'); ?>">

Answer 5

if you are using jQuery try this. First add id to your element

<input type="date" id="minDate">

then in between script tag put below code

$(document).ready(function () {
    var today = new Date().toISOString().split('T')[0];
    $("#minDate").attr('min', today);
});

It should work fine

 $(document).ready(function() { var today = new Date().toISOString().split('T')[0]; $("#minDate").attr('min', today); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="date" id="minDate">