我正在尝试使用jQuery
基于省份创建城市的级联下拉菜单,但我一直收到错误:
无法加载资源:net :: ERR_SPDY_PROTOCOL_ERROR
我的Javascript正在解雇。
$(function () {
$('#provinceList').change(function () {
var url = '@Url.Content("~/")' + "Cities/GetCityByProvince";
var ddlSource = "#provinceList";
$.getJSON(url, { provID: $(ddlSource).val() }, function () {
$("#cityList").append("<option value=1> Hi + </option>")
// });
//$("#cityList").html(items);
})
});
});
我的班级的返回对象正确填充了
public ActionResult GetCityByProvince(int provID)
{
List<City> cities = new List<City>();
cities = _context.Cities.Where(m => m.ProvinceId == provID).ToList();
cities.Insert(0, new City { ID = 0, CityName = "Please select your nearest city" });
var x = Json(new SelectList(cities, "Id", "CityName"));
return Json(x);
}
但是我仍然收到此错误。
答案 0 :(得分:0)
您可以使用此解决方案。 并尝试其他浏览器。
jQuery(function ($) {
$('select').on('change', function () {
if ($(this).attr('data-parent') != null) {
var parent = $(this).attr('data-parent').replace(".", "\\\\.");
if (parent != null && param != undefined) {
var data = $.extend(
{
render: $(this).attr('data-parent'),
url: $(parent).attr('data-url'),
type: "get",
dataType: "html",
data:
{
"value": ($(this).val() == $(this).attr('data-master') ? null : $(this).val())
}
}, data);
FromJson(data);
if ($(this).val() != "-Select-") {
$(parent).show();
}
else {
$(parent).hide();
}
}
}
});
});
function FromJson(param) {
$.ajax({
url: param.url,
type: 'GET',
data: param.data,
dataType: 'json',
async: true,
success: function (data) {
var options = $(param.render);
$(param.render).empty();
options.append($('<option value=""/>').text("-Select-"));
if (data.length > 0) {
$.each(data, function () {
if (param.dataText == null) {
options.append($('<option />').val(this.Value).text(this.Text));
}
else {
options.append($('<option />').val(this.Value).text(this.str));
}
});
}
else {
options.append($('<option />').text("-Error-"));
}
if (param.selected != null && param.selected != 0) {
$(param.render).val(param.selected);
}
}
});
}
然后;
<select data-parent="#state" id="city" name="city" class="form-control valid" data-url="/Json/city" data-type="live">
</select>
<select data-parent="#town" id="state" name="state" class="form-control valid" data-url="/Json/state">
</select>
<select data-parent="#zip" id="town" name="town" class="form-control valid" data-url="/Json/town">
</select>
<select id="zip" name="zip" class="form-control valid" data-url="/Json/zip">
</select>