This is a migrated thread and some comments may be shown as answers.

DropDownlist Validation is not validating

1 Answer 979 Views
DropDownList
This is a migrated thread and some comments may be shown as answers.
Bharathi
Top achievements
Rank 2
Bharathi asked on 14 Mar 2014, 01:50 PM
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>

1 Answer, 1 is accepted

Sort by
0
Accepted
Daniel
Telerik team
answered on 18 Mar 2014, 08:47 AM
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.

 
Tags
DropDownList
Asked by
Bharathi
Top achievements
Rank 2
Answers by
Daniel
Telerik team
Share this question
or