kendoValidator and AddModelError

[Nassouh Chehayeb]

Hello.

I'm using kendoValidator to display all my validation errors with the kendo validation template. Using this:

 

<script>
    $(function () { $("form").kendoValidator();});
</script>

 

But I have certain errors that I handle server side in the controller. Because they are kind of complex. And then I added the errors to the model this way:

 

ModelState.AddModelError("Hours", "The hours and the minutes can't be both 0.");

 

But if I add an error this way it is displayed with the standard ASP NET MVC way:

 

 

<span class="field-validation-error text-danger" data-valmsg-for="Hours" data-valmsg-replace="true">The hours and the minutes can't be both 0</span>

 

¿Is some kind of way to display those errors like the kendoValidator  way?

In the image attached I show one error client side like kendo validation and two error's server side. I would like to all of then be like the client side error.

Thank you.

<span class="field-validation-error text-danger" data-valmsg-for="Hours" data-valmsg-replace="true">The hours and the minutes can't be both 0.</span>

[Daniel]

Hi,

You can convert the messages via JavaScript on document ready:

<script type="text/kendo-template" id="message">
    <span class="k-widget k-tooltip k-tooltip-validation k-invalid-msg field-validation-error" data-for="#=field#" data-valmsg-for="#=field#" id="#=field#_validationMessage">
        <span class="k-icon k-warning"> </span> #=message#
    </span>
</script>

<script type="text/javascript">

    $(function () {
        $("form").find(".field-validation-error").replaceWith(function (e) {
            var element = $(this);
            return validationMessageTmpl({ field: element.attr("data-valmsg-for"), message: element.text() });
        });
        var validationMessageTmpl = kendo.template($("#message").html());
        $("form").kendoValidator();
    });
</script>

The validator will not style the messages unless there is a client-side validation rule for the inputs.

Regards,
Daniel
Telerik

 

 

[Nassouh Chehayeb]

It worked perfectly. 

Thank you very much.

[Steve]

Had to tweak the template a bit:

    <div class="k-widget k-tooltip k-tooltip-validation k-invalid-msg field-validation-error" style="display:block; margin-top: 6px;" data-for="#=field#" data-valmsg-for="#=field#" id="#=field#_validationMessage" role="alert">
        <span><i class="k-icon k-i-warning"></i>#=message#</span>
        <span class="k-callout k-callout-n"></span>
    </div>