我有一个级联的下拉列表,第一个用户将选择一个
国家和根据他的选择城市将通过ajax填充,其中最初没有选择城市,但只选择了一个SELECT选项。我在国家下拉列表的更改事件中使用来自控制器的ajax JSON数据填充了我的城市,但是在我调用#CityId.Empty()
时,它从城市中移除了所有选项,包括我通过jquery代码插入的SELECT选项但是该行被视为选项而不是OPTION SELECT,因为验证假定它是用户选择,而实际上它是用户选择任何给定城市的消息。所以如果没有选择城市,请帮助我进行验证工作,不应该允许我提交表格。
public ActionResult PostAd(ClassifiedItem classifiedItem)
{
if (ModelState.IsValid)
{
classifiedItem.PostedDate = DateTime.Now;
classifiedItem.Obsolete = false;
classifiedItem.Status = "POSTED";
db.ClassifiedItems.Add(classifiedItem);
db.SaveChanges();
return View("ImageUploader", classifiedItem);
}
else
{
if (classifiedItem.City_Id == 0 || classifiedItem.City_Id == null)
{
ViewBag.Country_Id = new SelectList(db.Countries, "Id", "Country_Name");
ViewBag.City_Id = new SelectList(new List<City>(), "Id", "City_Name",0);
}
else
{
SetCascadedCountry(classifiedItem.City_Id);
}
Prepare_LOV_Data();
}
return View(classifiedItem);
}
<div class="form-group">
<label class="control-label col-md-3">Country</label>
<div class="col-md-6">
@Html.DropDownList("Country_Id", null, "--Select Country--", htmlAttributes: new { @class = "form-control" })
</div>
</div>
<div class="form-group">
<label class="control-label col-md-3">City</label>
<div class="col-md-6">
@Html.DropDownList("City_Id", null,"--Select City--", htmlAttributes: new { @class = "form-control"})
@Html.ValidationMessageFor(model => model.City_Id, "", new { @class = "text-danger" })
</div>
</div>
$('document').ready(function () {
$('#Country_Id').on('change', function (d) {
$.ajax({
url: 'GetCities',
method: 'Get',
cache: false,
data: { CountryId: $(this).val() },
success: function (d) {
$('#City_Id').empty();
//$('#City_Id').append($('<option/>', { value: 0, text: '--Select City--' }));
$(d).each(function (index, item) {
$('#City_Id').append($('<option/>', { value: item.Id, text: item.City_Name }));
})
},
error: function (d) {
alert(d);
}
})
});
})