Show Out-of-Range DatePicker Dates as Disabled
Environment
| Product | Progress® Kendo UI® DatePicker for jQuery |
| Operating System | Windows 10 64bit |
| Visual Studio Version | Visual Studio 2017 |
| Preferred Language | JavaScript |
Description
How can I show the dates that are out of the min-max range as disabled in the Kendo UI for jQuery DatePicker?
Solution
The following example demonstrates how to show the dates that are out of the min-max range as disabled by using the k-disabled class.
<input id="datepicker" style="width:200px;" />
<script>
$(document).ready(function() {
$("#datepicker").kendoDatePicker({
value: new Date(2014, 10, 20),
min: new Date(2014, 10, 10),
max: new Date(2014, 11, 10),
month: {
empty: '<span class="k-disabled">#= data.value #</span>'
}
});
});
</script>