Server/Client Validation Not Occurring

4 posts, 1 answers
  1. Brian
    Brian avatar
    27 posts
    Member since:
    Aug 2013

    Posted 08 Jan Link to this post

    Hi,

    When using a complex model, validation does not occur (both client (Kendo UI) as well as server) -- only on the Editor helper; my other Kendo UI controls work fine.  Any thoughts on why?  I'm assuming it has something to do with the name and/or ID of the control.

    I've included relevant code.  Let me know if you need more info.

    View:

    <div class="form-group">
        @Html.LabelFor(m => m.Change.Description, new { @class = "col-sm-3 control-label" })
        <div class="col-sm-9">
            @Html.EditorFor(m => m.Change.Description)
        </div>
        <div class="col-sm-offset-3 col-sm-9">
            @Html.ValidationMessageFor(m => m.Change.Description)
        </div>
    </div>

     

    Model:

    public class CreateChangeViewModel
    {
        public CreateChangeModel Change { get; set; }
    }
     
    public class CreateChangeModel
    {
        [Display(Name = "Change Implementing")]
        [Required(ErrorMessage = "You must enter a description of the change.")]
        [UIHint("TextArea")]
        public string Description { get; set; }
    }

    Editor Template (TextArea.cshtml):

    @Html.Kendo().EditorFor(model => model).HtmlAttributes(new { style = "width: 100%; height: 200px;" }).Resizable(true)

     

    Thanks!

  2. Brian
    Brian avatar
    27 posts
    Member since:
    Aug 2013

    Posted 09 Jan Link to this post

    Hi,

    I found the cause of the error; however, I haven't been able to find a good solution yet.  The Editor control has a space in it by default, bypassing the required validation.  A workaround I came up with is to have the length of the control be greater than one character and trigger a required validation message there.  I don't know how to get rid of the space though -- even Value(string.Empty) keeps the space.

    Thanks!

  3. Answer
    Dimitar
    Admin
    Dimitar avatar
    261 posts

    Posted 10 Jan Link to this post

    Hello Brian,

    The described behavior is related to a known bug in the Kendo UI Editor, that can be reproduced with the current version of Kendo (2017.3.1026). When the textarea element of editor is defined as empty initially, a non-breaking space is applied in IE and Edge and leads to the observed validation problem. The issue is logged in the official Kendo UI GitHub repository and you can start tracking the progress that we make on it from item #3754.

    As a temporary workaround until the issue is addressed with an official fix, the Editor's value() method can be used to remove the non-breaking space:
    <script>
    $(function () {
    var editor = $("#FormDescription").getKendoEditor(),
      editorValue = editor.value();
     
    if (editorValue == " ") {
    editor.value("");
    }      
    });
    </script>

    Regards,
    Dimitar
    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. Brian
    Brian avatar
    27 posts
    Member since:
    Aug 2013

    Posted 10 Jan in reply to Dimitar Link to this post

    Hi Dimitar,

    It worked with the slight modification of using "&nbsp;" instesad of " ".  Thanks for your assistance!

    Brian
Back to Top