jQuery 来自选择框的jquery ajax调用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/4555116/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery ajax call from select box
提问by user545520
How to make ajax call from onchange event of select box using jquery? If anyone has a sample, please post the code.
如何使用jquery从选择框的onchange事件进行ajax调用?如果有人有示例,请发布代码。
回答by lk.annamalai
the below code is based on spring mvc architecture,
以下代码基于 spring mvc 架构,
$('#selectbox1').change(function() {
var data = "";
$.ajax({
type:"GET",
url : "controller mapping",
data : "selectbox1_selectedvalue="+$(this).val(),
async: false,
success : function(response) {
data = response;
return response;
},
error: function() {
alert('Error occured');
}
});
var string = data.message.split(",");
var array = string.filter(function(e){return e;});
var select = $('selectbox2');
select.empty();
$.each(array, function(index, value) {
select.append(
$('<option></option>').val(value).html(value)
);
});
$('#selectbox2').show();
});
inside the html, i use like below to display the selectbox2 values,
在 html 中,我使用如下所示来显示 selectbox2 值,
<tr>
<select id="selectbox1">
<option value="value1">value1</option><option value="value2">value2</option>
</select>
<select id="selectbox2"></select>
</tr>
in the selectbox2, values are loaded from a controller using ajax call, in controller i return like below,
在selectbox2中,使用ajax调用从控制器加载值,在控制器中我返回如下,
List<String> listvalues = listService.retrieveAll(searchTerm); // searchTerm is a selected value from selectbox1
String dummy = "";
for(int i=0; i<listvalues.size(); i++)
{
dummy += listvalues.get(i)+",";
}
MessageValue messageValue = new MessageValue(dummy);
return messageValue;
回答by Mark Baijens
$("#selectboxid").change(function() {
$.ajax({ url: "test.html", context: document.body, success: function(){
$(this).addClass("done");
}});
});