DropDownlist Validation is not validating

2 posts, 1 answers
  1. Bharathi
    Bharathi avatar
    16 posts
    Member since:
    Feb 2014

    Posted 14 Mar 2014 Link to this post

    Hello I'm trying to validate the dropdownlist and it is not validating.. Below is the code i'm trying.. DropDownlist and Date column is required field and when click the button it populate the grid view.. Even though I'm not selecting dropdownlist value it is not validating and populating the empty grid.


    @using DWH.WEB.Models.ViewModel
     
    @{
        ViewBag.Title = "test";
    }
    <div style="background-color: #E3F1F7; text-align: left; vertical-align: middle;">
    <h2>>>>test</h2>
    </div>
     
     
    <table>
    <tr>
     
    <td>
    <div class="section"style="width: 350px;">
     <h4>Select Entity code</h4>
     <div id="ValidateMyContents">
     @(Html.Kendo().DropDownList()
                .Name("dropdownlist")
                .HtmlAttributes(new { style = "width:320px" }) 
                .DataTextField("Text")
                .DataValueField("Value")
                //.OptionLabel("Please Select")
                .OptionLabel(new { Text = "Select Entity", Value = 0 })
                     .DataSource(source =>
                     {
                         source.Read(read =>
                         {
                             read.Action("GetEntityCode", "GLFINBAL");
                         });
                     })
             
             <span class="k-invalid-msg" data-for="dropdownlist"></span>        
     
        </div>
         
     </div>
    </td>
     
    <td>
    <div class="section"style="width: 250px;">
     <h4>Select FiscalYear</h4>
      
            @(Html.Kendo().DatePicker()
                  .Name("yearpicker")
                  .Start(CalendarView.Decade)
                  .Depth(CalendarView.Decade)
                  .Format("yyyy")
                  .Value("2014")             
                  .HtmlAttributes(new { style = "width:250px" })            
            )
        </div>
     
    </td>
     
    <td>
     
    <button id="showGrid" class="k-button" type="button" style="width: 150px">View Report</button><br />
     <span id="status"></span>
    </td>
     
    </tr>
     
    <tr>
    <td colspan="3">
     
    </td>
     
    </tr>
     
    </table>
     
     
    <script>
     
        $("#showGrid").click(function (e) {
            e.preventDefault();
            $("#status").text("");
            var validator = $("#ValidateMyContents").kendoValidator().data('kendoValidator');
            if (validator.validate()) {
                $("#status").text("Entity was selected");
     
            } else {
                $("#status").text("Entity was not selected");
            }
     
            $("#AjaxGrid").data("kendoGrid").dataSource.read();
            $("#AjaxGrid").css("display", "block");
     
        });
     
     
     
     
     
    //    $("#showGrid").click(function () {
    //        $("#AjaxGrid").data("kendoGrid").dataSource.read();
    //        $("#AjaxGrid").css("display", "block");
    //    });
     
        function additionalInfo() {
            var info = $("#dropdownlist").data("kendoDropDownList").value();
            var yearpicker = $("#yearpicker").data("kendoDatePicker").value();       
            return {
                dropdownlist: info,
                yearpicker: yearpicker
            }
        }
         
    </script>
  2. Answer
    Daniel
    Admin
    Daniel avatar
    2117 posts

    Posted 18 Mar 2014 Link to this post

    Hello,

    How is the required validation specified? If the RequiredAttribute is used for the model property then you should use the same name or the DropDownListFor(recommended) helper:
    @(Html.Kendo().DropDownListFor(model => model.PropertyName)
        .HtmlAttributes(new { style = "width:320px" })
        .DataTextField("Text")
        .DataValueField("Value")
        //.OptionLabel("Please Select")
        .OptionLabel(new { Text = "Select Entity", Value = 0 })
         .DataSource(source =>
         {
             source.Read(read =>
             {
                 read.Action("GetEntityCode", "GLFINBAL");
             });
         })
    )

    in order for the validation attributes to be set. Otherwise, you should add the required attribute to the input with the HtmlAttributes method:
    .HtmlAttributes(new { style = "width:320px", required="required" })
    Also, note that the validator should be initialized only once and not each time the click handler is triggered:
    var validator = $("#ValidateMyContents").kendoValidator().data('kendoValidator');
     
    $("#showGrid").click(function (e) {
        e.preventDefault();
        $("#status").text("");  
        if (validator.validate()) {
            $("#status").text("Entity was selected");
     
        } else {
            $("#status").text("Entity was not selected");
        }
     
        $("#AjaxGrid").data("kendoGrid").dataSource.read();
        $("#AjaxGrid").css("display", "block");
    });



    Regards,
    Daniel
    Telerik
     

    DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.

     
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top