jQuery,JSON,Spring MVC-动态加载选择选项 [英] JQuery, JSON, Spring MVC - Dynamically loading select options
问题描述
我有一个像这样的jsp表格...第二个选择框中的值,应根据第一个选择框中的值(国家/地区)加载状态.我正在使用AJAX,JSON,Spring MVC来检索结果.
I have a jsp form like this... Values in the second select box, state should be loaded based on value in first select box (country),. I am using AJAX, JSON, Spring MVC to retrieve results.
index.jsp .....
index.jsp.....
<form:form name="myform" modelAttribute="search" action="POST">
<form:input path="firstName" class="text" />
<form:input path="lastName" class="text" />
<form:select path="country" id="country">
<form:option value="" label="--Choose A Value--"></form:option>
<form:options items="${countryList}" itemValue="id" itemLabel="name"></form:options>
</form:select>
<form:select path="state" onchange="javascript:itemFocus('submit');" id="state">
<form:option value="" label="--Choose A Value--"></form:option>
<form:options items="${stateList}" itemValue="id" itemLabel="description"></form:options>
</form:select>
<form:checkboxes items="${skillsList}" path="skills" itemLabel="description" itemValue="id" delimiter="<br>" />
<form:checkboxes items="${languagesList}" path="languages" itemLabel="description" itemValue="id" delimiter="<br>" />
</form:form>
控制器....
@RequestMapping(value="stateslist.html")
public @ResponseBody List<State> sectionList(@ModelAttribute("search") SearchForm search, @RequestParam(value="countryId", required=true) String countryId, ModelMap modelMap){
return stateService.getStates(countryId);
}
jQuery部分....
JQuery part....
<script type="text/javascript" charset="utf-8">
function getStates(){
$.getJSON(
"stateslist.html",
{countryId: $('#country').val()},
function(data) {
var html = '';
var len = data.length;
for(var i=0; i<len; i++){
html += '<option value="' + data[i].id + '">' + data[i].name + '</option>';
}
$('#state').append(html);
}
);
}
$(document).ready(function() {
$('#country').change(function()
{ getStates();
});
});
</script>
我可以从调试器中看到,ajax请求正被提交到Spring控制器,并且它确实返回了State对象的列表,其中包含诸如id,name等字段.问题是状态选择选项是没变..似乎是function(data){....}
部分无法正常工作..有人可以帮助我在这里做错的地方吗...
I can see form the debugger that the ajax request is getting submitted to the the Spring controller and it does returns a list of State objects, which contains fields like id, name etc... Problem is that the state select options are not changing.. seems to be that function(data){....}
part is not working..can someone help me where I am doing wrong here...
---更新---
我已经从回调函数中删除了所有内容,然后才有了..
I have removed everything from the callback function and just had thi..
function(data){alert("something");}
即使这样也不起作用...这意味着呼叫从未到达该部分...
even this didn't work... that mean call never reached that part...
推荐答案
我有相同的代码,其中城市(cityId)的值根据国家(countryId)的选择而改变.效果完美:
I have the same code where city (cityId) values are changed according to country (countryId) selection. It works perfect:
$("select#countryId").change(function(){
$.getJSON("getCityList.do",{countryCode: $(this).val()}, function(j){
var options = '';
for (var i = 0; i < j.length; i++) {
options += '<option value="' + j[i].id + '">' + j[i].name + '</option>';
}
$("select#cityId").html(options);
});
});
所以我认为您只需要添加选择"前缀即可.
So I think you just need to add "select" prefix.
这篇关于jQuery,JSON,Spring MVC-动态加载选择选项的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!