How can I show a date on a kendo datepicker which is less than min date or greater than max date

Question

How can I set a date (e.g. 1/1/2012) on a kendo datepicker which is less than min date (e.g. 1/1/2013) or greater than max date (e.g. 1/1/2014) defined in the datepicker options?

My requirement is to restrict the user's selection to the range between min and max, but I want the datepicker to show values that are outside of that range (e.g. if the value is overridden in the database).

Answer 1

So you need to be able to select an invalid date in the datepicker, but display an error message if it is an invalid date.

Sounds like you need a kendo validator widget for your datepicker. Kendo docs for validator http://docs.kendoui.com/api/framework/validator

JSbin sample http://jsbin.com/itiqaDU/1/edit

Answer 2

If you create a datepicker with min and max options like this:

var datePicker = $('#input').kendoDatePicker({
    min: new Date(2013, 0, 1),
    max: new Date(2013, 11, 31)
}).data("kendoDatePicker");

then you can't set a value outside of that date range. You could either create your own widget, or you could remove the min/max restrictions temporarily for setting your value:

// temporarily remove the restrictions
var min = datePicker.options.min;
var max = datePicker.options.max;
datePicker.options.min = new Date(1900, 0, 1);
datePicker.options.max = new Date(2099, 11, 31);
// set your date which may be outside of the range specified by min/max
datePicker.value(new Date(2009, 0, 1));
// restore the min/max options so the user still can only choose within the range
datePicker.options.min = min;
datePicker.options.max = max;