Show Out-of-Range Dates as Disabled
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-state-disabled">#= data.value #</span>'
}
});
});
</script>
See Also
- DatePicker JavaScript API Reference
- How to Set the First Weekday
- How to Create Date Masking
- How to Globally Modify Default Options
- How to Hide the Default Button
- How to Integrate DatePicker with DateJS Library
- How to Make Input Elements Readonly
- How to Persist Entered Dates
- How to Resize Calendar Based on Input Width
For more runnable examples on the Kendo UI DatePicker, browse its How To documentation folder.