Custom validation stops working on Date field

5 posts, 0 answers
  1. Matt
    Matt avatar
    6 posts
    Member since:
    Feb 2018

    Posted 13 Mar 2018 Link to this post

    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);

  2. Stefan
    Admin
    Stefan avatar
    2880 posts

    Posted 15 Mar 2018 Link to this post

    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
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Stefan
    Admin
    Stefan avatar
    2880 posts

    Posted 20 Mar 2018 Link to this post

    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
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  4. Matt
    Matt avatar
    6 posts
    Member since:
    Feb 2018

    Posted 20 Mar 2018 Link to this post

    Sounds good.  Thanks for the update.
  5. Stefan
    Admin
    Stefan avatar
    2880 posts

    Posted 22 Mar 2018 Link to this post

    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 patience.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top