I have an HTML <input /> with type=date and I'm trying to use javascript to disable an array of dates but for some reason, it is not working and not sure where I got it wrong, below is my code:
var array = ["2022-08-25", "2022-08-22", "2022-08-21"]
$('input[type="date"][name="tester"]').datepicker({
beforeShowDay: function(date) {
var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
return [array.indexOf(string) == -1]
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.min.js" integrity="sha256-eTyxS0rkjpLEo16uXTS0uVCS4815lc40K2iVpWDvdSY=" crossorigin="anonymous"></script>
<input type="date" name="tester">
Creating a datepicker on an
<input type="date">is not supported due to a UI conflict with the native picker.
See more: https://api.jqueryui.com/datepicker/
Consider the following.
var array = ["2022-08-25", "2022-08-22", "2022-08-21"]
$('input[name="tester"]').datepicker({
beforeShowDay: function(date) {
var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
return [array.indexOf(string) === -1]
}
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
<input type="text" name="tester">