Kendo UI date picker max date validation

Question

I have a Kendo UI date picker extension for MVC4. I have set the max date as 31-Aug-2014. If we are entering date more than max date manually it shows a validation message. Message contain the ID of the control. I need to add custom message and I don't have any model also.

 @(Html.UI().DatePicker()
       .Name("dpReceiptDate")           
       .Value(DateTime.Today)
       .Enable(false)
       .HtmlAttributes(new { style = "width: 100%;" })
       .Events(events => events.Change("dateChange"))  
 )

code for max date and min date setting using javascript is

var receiptDate = $('#dpReceiptDate').data('kendoDatePicker');
var receiptDateVal = receiptDate.value();
receiptDate.min(new Date(receiptDateVal.getFullYear(), receiptDateVal.getMonth(), 1));
receiptDate.max(new Date(receiptDateVal.getFullYear(), receiptDateVal.getMonth() + 1, 0));

validation message is shown below enter image description here

I need a custom message that will not contain the ID of date picker.

Please provide a good solution.

Thanks in advance.

Derdlim Derdlim · Accepted Answer · 2014-08-21T21:09:08

You need to use something like this.

$("#MyForm").kendoValidator({
rules: {
    //implement your custom date validation
    dateValidation: function (e) {
        var currentDate = Date.parse($(e).val());
        //Check if Date parse is successful
        if (!currentDate) {
            return false;
        }
        return true;
    }
},
messages: {
    //Define your custom validation massages
    required: "Date is required message",
    dateValidation: "Invalid date message"
}

});

Kendo UI date picker max date validation

1 Answers