DropDownList validation client side

2 posts, 0 answers
  1. Paolo
    Paolo avatar
    423 posts
    Member since:
    Jun 2009

    Posted 27 Aug 2013 Link to this post

    Hello,
    I've got some troubles validating 4 dropdownlist I've on a page... I've looked at this page

    http://demos.kendoui.com/web/validator/index.html

    but it refers to HTML version and I don't know how to use it with Kendo Wrappers...

    Here's a piece of code only for the first dropdownlist (the other 3 are similar)

    <div id="myform">
            @(Html.Kendo().DropDownList()
              .Name("cbFiliali")
              .HtmlAttributes(new { style = "width: 250px" })
              .DataTextField("Descr")
              .DataValueField("ID")
              .DataSource(source =>
              {
                  source.Read(read =>
                  {
                      read.Action("GetListaFiliali", "Common", new { Area = string.Empty });
                  }).ServerFiltering(false);
              })
                         
            )
     
            <input id="btnCarica" type="button" value="CARICA" />
        </div>
     
     
        <script>
            var validator = $("#myform").kendoValidator(
                {
                    rules: {
                        customRule1: function (input) {
                            // all of the input must have a value
                            return $.trim(input.val()) !== "";
                        }
                    }
                }).data("kendoValidator");
     
            //validate the state on button click
            $("#btnCarica").click(function () {
                //validate the input elements and check if there are any errors
                //if (validator.validate()) {
                if (validator.validateInput($("DropDownList[name=cbFiliali]"))) {
                    var ddFiliali = $("#cbFiliali").data("kendoDropDownList");
                    var filiale = ddFiliali.value();
                    alert(filiale);
                }
                else
                    alert("NON VALIDO");
            });
     
    </script>
    Is there a way of forcing a value to be selected? I'm not really familiar with javascript so maybe I'm missing something really simple...
    Thanks
  2. Daniel
    Admin
    Daniel avatar
    2118 posts

    Posted 28 Aug 2013 Link to this post

    Hello Paolo,

    You could either add the needed validation attributes with the HtmlAttributes method:

    .HtmlAttributes(new { style = "width: 250px", required = "required" })
    or use DataAnnotation attributes on the model property(requires kendo.aspnetmvc to be included). Regards,
    Daniel
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top