Html 5 [input type=Date] control, MAX date is not working in iPhone/Ipad

Question

Greetings.

Working with html date input control.

input type="date" max="2014-13-11"

In chrome its recognizing 'max'attribute hence restricting and disabling all future date

But, the same is not working in iPad/iphone. Instead its allowing to select future date in iPad.

Googled and came to know that ipad is not yet supporting Max attribute of date control.

Is there any work around? or any points / direction will be really help for me.

Many thanks. Karthik

Answer 1

Safari on iOS does not support the attributes max and min for input="date".

You could use a JavaScript datapicker like Pikaday for this. See demo below:

var today = new Date();
var lastMonth = new Date().getMonth() - 1;

var picker = new Pikaday({
  field: document.getElementById('datepicker'),
  maxDate: today,  // maximum/latest date set to today
  // demo only
  position: 'top left',
  reposition: false
});

<!-- Pikaday Library -->
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/pikaday/css/pikaday.css">
<script src="https://cdn.jsdelivr.net/npm/pikaday/pikaday.js"></script>

<!-- Datepicker Input -->
<label for="datepicker">Date</label>
<input type="text" id="datepicker">

For more info, please refer to the documentation on GitHub.