<ul> 在下拉列表中选择值,从 <li> Java 脚本追加后



我有2个下拉列表(ul下拉列表(,需要根据第一个选择填充第二个。

这是完整的代码

<div id="dd" class="wrapper-dropdown-1 brderRad" tabindex="1">
<span>From Any Country</span>
<ul class="dropdown">                    
@foreach (var country in Model.country_list)
{
<li class="coun" id="@country.country_id"><a href="#">@country.country_name</a></li>
}
</ul>
</div>
<div id="dd2" class="wrapper-dropdown-1 brderRad" tabindex="1">
<span>From Any City</span>
<ul class="dropdown city_drop" id="city_drop_id">
</ul>
</div>

.JS

<script type="text/javascript">
$(document).ready(function () {
$('.coun').click(function () {
var id = ($(this).attr('id'));
$("#city_drop_id").empty();
$.ajax({
url: '@Url.Action("GetCityList", "Home")',
type: 'POST',
contentType: 'application/json',
dataType: 'json',
data: JSON.stringify({ id: $(this).attr('id') }),
success: function (data) {  
if (data.success) {
var dataa = data.dataDic;
$.each(dataa, function (i, item) {                 
$('#city_drop_id').append('<li class="selected" value="' + item.ID + '"><a href="#">' + item.Name + '</a></li>');                                         
});
//  $('#city_drop_id').dropdown('refresh');
} else {
alert('Failed');
}
}  
});  
});
});  
</script>

控制器 - 根据国家/地区选择检索城市列表

[HttpPost]
public JsonResult GetCityList(string id)
{
Dictionary<int, string> cityDic = new Dictionary<int, string>();
cityDic = citydbRep.GetAllCityList().Where(i=>i.city_country_id 
==Convert.ToInt32(id)).ToDictionary(t => t.city_id, t => t.city_name);
var dataDic = cityDic.Select(u => new
{
ID = u.Key,
Name = u.Value
});
return Json(new { success = true, dataDic });
}

现在追加工作正常,但无法从第二个下拉列表中选择值(城市(。

请有人建议解决这个问题的方法吗?

谢谢

您需要添加级联下拉列表。 您可以在更改功能上实现此目的

[yourID].onchange = function () {
}

查看此内容以获取更多详细信息

最新更新