Validation message does not always use custom message in IE 9

[Daniel]

Hello,
When I try the validation with a wrong input it some times gives me "Created is invalid". But I do expect the message to be "Invalid Format. Use: mm/dd/yyyy" instead. It appears that Kendo validator does it's own validation even if I returns false. What am I missing here?. it works well in Chrome and Firefox but not in IE

Thanks for your answer and looking forward to it.
 
Note: Code is written in Razor under MVC

        $("#Created").kendoValidator({
            rules: {
                dateValidation: function (e) {
                    if (!$(e).val())
                        return true; 
                   var currentDate = kendo.parseDate($(e).val());
                    if (!currentDate) {
                     return false;
                     }
                    return true;
                }
            },
            messages: {
                dateValidation: "Invalid format. Use: mm/dd/yyyy"
            }
        });

[Daniel]

Hello Daniel,

The validator has a built-in date rule that will be triggered before the custom rule so the built-in message will be shown. If you wish to override the default message then you should override the "date" message:

messages: {
    date: "Invalid format. Use: mm/dd/yyyy"
}

If you also wish to override the rule then you should use "date" as name for the rule.

Regards,
Daniel
Telerik

[Daniel]

Hello Daniel,

Thanks for answering and it worked but it created another problem. Now in Chrome the validation goes behind the Date picker control. I tried to position the validation message with a <span> with the following code as given on your forums but I have no luck. Could you tell me how I would do that.

 @(Html.Kendo().DatePicker()
     .Name("Created")
     .Value(date)
     .ParseFormats(new[] { "MM/dd/yyyy", "MM/dd/yy" })         
     )
<span class="k-invalid-msg" data-for="Created"></span>

and the script
$("#Created").kendoValidator({
         rules: {
                    dateValidation: function (e) {
                    if (!$(e).val())
                    return true;
                    var currentDate = kendo.parseDate($(e).val());
                    if (!currentDate) {
                                 return false;
                     }
                     return true;
         }
},
         messages: {
                   date: "Invalid format. Use: mm/dd/yyyy"
         }
});

[Daniel]

Hello again,

The problem occurs because the Validator is initialized directly on the datepicker and so the span element will not be found. You could wrap the datepicker in another element and use it to use to initilize the Validator in order to avoid the problem:

<span id="createdValidator">
    @(Html.Kendo().DatePicker()
         .Name("Created")
         .Value(date)
         .ParseFormats(new[] { "MM/dd/yyyy", "MM/dd/yy" })
         )
    <span class="k-invalid-msg" data-for="Created"></span>
</span>

$("#createdValidator").kendoValidator({
     messages: {
        date: "Invalid format. Use: mm/dd/yyyy"
     }
});

Regards,
Daniel
Telerik