how i can validate dropdownlist with unobtrusive javascript ? As its validating textbox for required validator , but its not working for dropdownlist ?
Need to change unobtrusive js file for it ? or is there any other option to validate dropdownlist ?
i want to show errors when i checked form.validate() in my javascript .
Markup
<p>
<label for="ProductCategoryList">Product Categories</label>
<%= Html.DropDownList("ProductCategoryList", ViewData["ProductCategories"] as SelectList)%>
</p>
And the validation script
$.validator.addMethod("selectNone",
function (value, element) {
return this.optional(element) || element.selectedIndex != 0;
},
"Please select an option."
);
$(function () {
$("#form1").validate({
rules: {
ProductCategoryList: {
selectNone: true
}
},
messages: {
ProductCategoryList: {
selectNone: "This field is required"
}
}
});
});
$(function () {
$("#form1").validate({
rules: {
ProductCategoryList: {
required: true
}
},
messages: {
ProductCategoryList: {
required: "This field is required"
}
}
});
});
You have to leave the first option value="" for it to work.
<asp:ListItem Value="">- Select Something -</asp:ListItem>
The best I've seen is using the jQuery Form Validation plugin:
http://plugins.jquery.com/project/validate
http://bassistance.de/jquery-plugins/jquery-plugin-validation/
I got this working by creating a property on the Viewmodel which is used for binding to the selecteditem in the DropDownList. An example will make it clear:
The code in the View:
<div class="editor-field">
@Html.DropDownListFor(model => model.SelectedPlantID,
new SelectList(Model.Plants, "Value", "Text"),
" ", new { id = "ddlPlant" })
@Html.ValidationMessageFor(model => model.SelectedPlantID)
</div>
The code in the ViewModel will be(strongly typed to the view):
private List<SelectListItem> _plants = new List<SelectListItem>();
[Required]
[Display(Name = "Plant")]
public List<SelectListItem> Plants
{
get
{
return (_plants);
}
set
{
_plants = value;
}
}
public Guid SelectedPlantID
{
get;
set;
}
Note : the SelectedPlantID does not have to be a field on your model.
Hope this works for you!
If you want to integrate the validation jQuery you need to specify the field
Use DropDownListFor not DropDownList
@Html.DropDownListFor(c => c.Profile_Id, null, "-- Choose --", new { @class = "input-large" })
If your list has the same name as the field, you don't need to put ViewBag.Profile_Is as SelectList because it doesn't work for the edit scenario if you send a null value in list.
