[英]Validate DropDown using Jquery in MVC3
我已經實現了簡單的MVC3應用程序,因此我想驗證特定形式的DIV控件
// ViewModel
public class NewStreamViewModel
{
public NewStreamViewModel()
{
this.Streams = new List<SelectListItem>();
this.Subjects = new List<SelectListItem>();
this.Languages = new List<SelectListItem>();
}
[Display(Name = "Language")]
[Required(ErrorMessage = "{0} is Required")]
public int? LanguageId {get;set;}
[Display(Name = "Stream")]
[Required(ErrorMessage = "{0} is Required")]
public int? StreamId {get;set;}
public int[] SubjectIds {get;set;}
public List<SelectListItem> Languages {get;set;}
public List<SelectListItem> Streams {get;set;}
public List<SelectListItem> Subjects {get;set;}
}
//View.cshtml
<div id="tab1">
@using (Html.BeginForm())
{
<table style="background: none; width: 100%;">
<tr>
<td>
Language
</td>
<td>
@Html.DropDownListFor(m=>m.LanguageId.Value,Model.Languages)
@Html.ValidationMessageFor(m=>m.LanguageId.Value)
</td>
</tr>
<tr>
<td>Stream
</td>
<td>
@Html.DropDownListFor(m => m.StreamId.Value, Model.Streams)
@Html.ValidationMessageFor(m=>m.StreamId.Value)
</td>
</tr>
<tr>
<td>Subjects
</td>
<td>
@Html.ListBoxFor(m => m.SubjectIds, Model.Subjects, new { Style = "width:300px;" })
</td>
</tr>
</table>
}
<input type="button" value="Save" id="addspan" />
</div>
<script type="text/javascript">
$(function () {
var count = 2;
$('#wrap').tabs();
$('#addspan').click(function () {
var $step = $('#tab1');
var validator = $("form").validate(); // obtain validator
var anyError = false;
var selects = $('#tab1').find('select');
selects.each(function () {
if (!validator.element(this)) { // validate every input element inside this step
anyError = true;
}
});
if (anyError) {
return false;
}
count++;
});
});
</script>
我怎樣才能在jQuery的客戶端驗證這些下拉菜單?
將此文件添加到您的頁面(這將允許客戶端驗證):
<script src="@Url.Content("~/scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
致電:
$('form').valid()
如果沒有錯誤,將返回true
如果沒有錯誤,則返回false
,並在輸入附近顯示錯誤。
您可以像這樣手動驗證下拉菜單:
$('#addbtn').click(function(){
var ddlvalue= $("#dropdownid option:selected").val();
if(ddlvalue!='-1')
{
//Do your work.
}
else
alert('Please select product");
});
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$('#<%=btnSubmit.ClientID%>').click(function () {
if ($('#<%=ddlCity.ClientID%>').val() == 0) {
alert('Please select Country')
return false;
}
if ($('#<%=txtName.ClientID%>').val() == "") {
alert(' Name')
return false;
}
});
});
</script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.