Using Model validation for View Model elements

5 posts, 0 answers
  1. Mahesh Kumar
    Mahesh Kumar avatar
    3 posts
    Member since:
    Aug 2013

    Posted 27 Aug 2013 Link to this post

    Hi,

    Could you please anyone advise me how can i bind model class data annotation attributes using Kendo MVVM?

    I have defined the Employee model class as below,

      public class EmployeeModel
        {
            public int EmployeeId { get; set; }

            [Display(Name = "Employee Name")]
            [DataType(DataType.Text)]
            [Required(ErrorMessage = "The employee name should not be empty")]
            [StringLength(50, ErrorMessage = "The employee name should be less than 50 characters length")]
            public string Name { get; set; }

            public bool IsActive { get; set; }
        }

    and i have bound this model class into view page using observable object binding. I can use HTML5 attributes for validation and validate using the below Kendo validator code, EmployeeDetails - observable object.

                                   <input type="hidden" id="employeeId" data-bind="value : EmployeeDetails.EmployeeId"/>
                                    Name<br />
                                    <input data-bind="value: EmployeeDetails.Name" type="text" id="Name" name="Name" class="k-textbox" 
                                        placeholder="Employee name" required validationMessage="Please enter employee {0}" />
                                    <div></div>
                                    <span class="k-invalid-msg" data-for="Name"></span>
                                 
                                    <input type="checkbox" data-bind="checked: EmployeeDetails.IsActive" id="Status" />


               var validator = $("#EmployeeDetailsView").kendoValidator().data("kendoValidator");

                    if (!validator.validate()) {
                        $("#Name").focus();
                        return false;
                    }

    Now, how can i achieve the same validation by binding the  model attributes directly to input fields with HTML5 validation attributes mentioned as above?
    At the same time i have to use observable object binding for elements.

    Cheers,
    Mahesh
  2. Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 29 Aug 2013 Link to this post

    Hello Mahesh,

    You should use a HTML helper in order for the unbotrusive validation attributes to be rendered based on the DataAnnotation attributes. In order for the Validator to work for the unobtrusive attributes you should include the kendo.aspnetmvc JavaScript file or add custom rules to the validator that validate the input based on the attributes.

    Regards,
    Daniel
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Mahesh Kumar
    Mahesh Kumar avatar
    3 posts
    Member since:
    Aug 2013

    Posted 29 Aug 2013 Link to this post

    Hi Daniel,

    Could you please advise how can i implement unobtrusive attributes validation using kendo.aspnetmvc JavaScript file?
    Please suggest with simple example?

    Cheers,
    Mahesh
  5. Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 30 Aug 2013 Link to this post

    Hello Mahesh,

    I attached a sample project that demonstrates using the Kendo Validator for the rules defined with the DataAnnotation attributes. 

    Regards,
    Daniel
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Mahesh Kumar
    Mahesh Kumar avatar
    3 posts
    Member since:
    Aug 2013

    Posted 10 Sep 2013 Link to this post

    Thanks Daniel.

    Cheers,
    Mahesh
Back to Top
Kendo UI is VS 2017 Ready