How can I apply Kendo UI validations with Entity class Data Annotations?

6 posts, 0 answers
  1. Haidar
    Haidar avatar
    2 posts
    Member since:
    Sep 2012

    Posted 29 Oct 2012 Link to this post

    How can I apply Kendo UI validations with Entity class Data Annotations?

    I want to utilize my Validation messages defined with my Model classes. I love to use Kendo UI Validations but I am struggling to implement my ViewModel entity class data annotations. 

    Please show/refer some demos of this problem's solution.

    Regards,
    Haidar
  2. johnsk
    johnsk avatar
    8 posts
    Member since:
    Sep 2012

    Posted 01 Nov 2012 Link to this post

    One more vote on board wondering about same thing, and would be just great for a sample to be provided by Kendo dream team :-)
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. preet
    preet avatar
    6 posts
    Member since:
    Jan 2011

    Posted 01 Nov 2012 Link to this post

    Seriously Telerik team wants traditional asp.net mvc developers to go for Kendo, they should provide a proper example of how Kendo UI and framework fits with KendoUI asp.net mvc extensions. I want to start using it but lack of any meaningful example is really holding me up.
  5. Neil
    Neil avatar
    14 posts
    Member since:
    Jul 2012

    Posted 12 Nov 2012 Link to this post

    Hi,

    I'm using release version 2012.2.913 and the only data annotation that I've found so far that hasn't been working for me is the [EmailAddress] one which is a pain (at least for setting invalid email validation message) apart from that just adding the attributes to my view models and adding @Html.ValidationMessageFor() to the view does the trick (assuming you have the following settings in your web.config:    
     
    <add key="ClientValidationEnabled" value="true" /> 
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />

    and have included the following files:
    jquery.validate
    jquery.validate.unobtrusive
    kendo.aspnetmvc.min
    kendo.web.min
    kendo.validator.min

    then this will work:

    [View]

     <div class="editor-row">
         <div class="editor-label">@Html.LabelFor(m => m.FirstName)</div>
           <div class="editor-field">
                 @Html.TextBoxFor(m => m.FirstName, new { @class="k-textbox", @placeholder="enter first name" })
                 @Html.ValidationMessageFor(m => m.FirstName)
           </div>
     </div>

      $(document).ready(function () {
                //add kendo validator to page
                window.validator = $("#newPersonForm").kendoValidator().data("kendoValidator");
      });

    Model:
            [Display(Name = "First Name:")]
            [Required(ErrorMessage = "first name required")]
            public string FirstName { get; set; }

    Which Data Annotation(s) are you having trouble with?

    Thanks,

    Neil.
  6. Robert
    Robert avatar
    19 posts
    Member since:
    Dec 2012

    Posted 14 Jan 2013 Link to this post

    Converted
    @Html.EditorFor(model => model.SageCustomerNumber)

    to
    <input id="SageCustomerNumber"
    data-bind="value:SageCustomerNumber"
    data-value-field="SageCustomerNumber"
    data-text-field="SageCustomerNumber"
    style="width: 205px"/>

    The new input is bound to an kendoAutoComplete element. Using the EditorFor the data annotations worked, now using the kendoAutoComplete the validation is not firing. Any suggestions??
  7. Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 17 Jan 2013 Link to this post

    Hello Robert,

    You could use the TextBoxFor helper so that the validation attributes are applied to the input. The binding attributes can be set as parameter e.g.

    @Html.TextBoxFor(m=> m.FirstName, new {
        data_bind="value:SageCustomerNumber",
        data_value_field="SageCustomerNumber",
        data_text_field="SageCustomerNumber",
        style = "width: 205px"
                })
    Regards,
    Daniel
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
UI for ASP.NET MVC is VS 2017 Ready