Custom validation stops working on Date field

[Matt]

I have a grid containing a Start Date, an End Date, and a notes column.  For testing purposes, I added custom validation to check that the notes begins with an upper case letter, and it works just fine in all cases.  I added validation to the start date to make sure that the start date doesn't start after the end date, and vice versa for the end date.

The validation for these fields will show properly if I immediately select an invalid value.  However, if I select a valid value, and then select an invalid value, the validation message does not show.  The editor will not let me move away from the field until it is valid, so that piece is working - it just does not show the message.

I am using Kendo for MVC, with InCell editing.

//register custom validation rules
(function ($, kendo) {
    $.extend(true, kendo.ui.validator, {
        rules: { // custom rules
            notesvalidation: function (input, params) {
                if (input.is("[name='Notes']") && input.val() != "") {
                    input.attr("data-notesvalidation-msg", "Notes error");
                    return /^[A-Z]/.test(input.val());
                }

                return true;
            },
            startdatevalidation: function (input, params) {
                if (input.is("[name='StartDate']") && input.val() != "") {
                    input.attr("data-startdatevalidation-msg", "Start Date needs to be before End Date");
                    var row = input.closest("tr");
                    var grid = $('#Grid1').data().kendoGrid;
                    var dataItem = grid.dataItem(row);
                    if (dataItem.EndDate == "")
                        return true;
                    var result = (new Date(Date.parse(input.val())) <= dataItem.EndDate)
                    return result;
                }

                return true;
            },
            enddatevalidation: function (input, params) {
                if (input.is("[name='EndDate']") && input.val() != "") {
                    input.attr("data-enddatevalidation-msg", "End Date needs to be after Start Date");
                    var row = input.closest("tr");
                    var grid = $('#Grid1').data().kendoGrid;
                    var dataItem = grid.dataItem(row);
                    if (dataItem.StartDate == "")
                        return true;
                    var result = (new Date(Date.parse(input.val())) >= dataItem.StartDate)
                    return result;
                }

                return true;
            }
        },
        messages: { //custom rules messages
            productnamevalidation: function (input) {
                // return the message text
                return input.attr("data-val-notesvalidation");
            },
            startdatevalidation: function (input) {
                // return the message text
                return input.attr("data-val-startdatevalidation");
            },
            enddatevalidation: function (input) {
                return input.attr("data-val-enddatevalidation");
            }
        }
    });
})(jQuery, kendo);

[Stefan]

Hello, Matt,

I was able to replicate the issue on my end with date validation.

The validation message is shown but it is actually hidden under the cell.

I forwarded it to the developers' team to check if this is an issue with the Grid or a missing configuration which has to be added.

I will get back to you as soon as I have more details on this.

Thank you in advance for the patience.

Regards,
Stefan
Progress Telerik

[Stefan]

Hello, Matt,

I'm writing to let you know and the team is still investigating this. It was working up until R3 2017 and we assume that it may be caused by a change in the styles.

Once we have more details I will let you know.

Additionally, I updated your Telerik point for bringing this to our attention.

Regards,
Stefan
Progress Telerik

[Matt]

Sounds good.  Thanks for the update.

[Stefan]

Hello, Matt,

The issue has been confirmed and the developers' team is already working on it.

You can track its progress at:

https://github.com/telerik/kendo-ui-core/issues/4103

Thank you again for the .

Regards,
Stefan
Progress Telerik

[Chayanika]

var row = input.closest("tr")[0].rowIndex;
var dataItem = $("#Grid1").data("kendoGrid").dataSource.data()[row];
var endDate = dataItem.EndDate;