我在数据库国家,州和地区表中有3个表 最初能够在我的页面中绑定国家/地区列表, 如果我点击国家我想在另一个div相同的视图页面中根据国家ID显示相关的状态 喜欢列表(不在下拉列表中) 那么如果我点击状态我想根据状态ID绑定相关的区域 我试过了
public ActionResult Country()
{
//created view model to return multiple models to view
ViewModel vm = new ViewModel();
_countryAPI = new CountryAPI();
var country = _countryAPI.GetAll();
vm.countryViewModel = country.ToList();
return View(vm);
}
public JsonResult GetStates(int countryID)
{
ViewModel vm1 = new ViewModel();
_stateAPI = new StateAPI();
var states= _stateAPI .GetAll(countryID);
vm1.statesViewModel = states.ToList();
return Json(vm1, JsonRequestBehavior.AllowGet);
}
视图
@using Sample.ViewModel
@model Sample.ViewModel
<h4>countries</h4>
@if (Model.countryViewModel != null)
{
foreach (var item in Model.countryViewModel)
{
<div class="collapse navbar-collapse" >
<ul class="nav navbar-default">
<li class="">
<a id="@item.CID" onclick="stateClick(this)" >@item.CName</a>
</li>
</ul>
</div>
}
}
else
{
<div></div>
}
<h4>States</h4>
@if (Model.statesViewModel != null)
{
foreach (var item1 in Model.statesViewModel)
{
<div>
<ul class="list-group">
<li class="list-group-item">
<a id="@item1.SID" onclick="districtClick(this)">@item1.SName</a>
</li>
</ul>
</div>
}
}
else
{
<div>no states</div>
}
脚本
function stateClick(el) {
var countryID= $(el).attr("id");
$.ajax({
url: '/Home/GetStates',
type: "GET",
dataType: "json",
data: { countryID: countryID },
success: function (result) {
console.log(result);
},
error: function () {
console.log(error);
}
});
}
能够绑定国家的名单,在点击国家的时候获得国家id以及json结果 不返回视图,json结果返回视图模型,视图中没有结果绑定