在Spring项目中使用Ajax的forEach：如何更新交流？ [英] How do I update a c:forEach using Ajax in Spring project?
本文介绍了在Spring项目中使用Ajax的forEach：如何更新交流？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
以下是AJAX code，我选择在下拉列表中选择值，我得到一个列表控制器回来。当我拿到名单回来，我想更新C：使用AJAX结果的forEach项目。
AJAX
＆LT;脚本＆GT;
$（文件）。就绪（函数（）{
$（＃byCollege）。改变（函数（）{
//获取和转换数据发送
//例：此变量包含选定的选项文本
。VAR collName = $（'＃byCollege）VAL（）;
VAR studentName ='$ {}工资;
VAR JSON = {名：studentName，collName：collName};
//发送数据作为Ajax POST请求
$阿贾克斯（{
网址：HTTP：//本地主机：8080 / AnnaUnivResults / MVC / byCollege
键入：POST，
数据类型：JSON，
数据：JSON.stringify（JSON）
的contentType：应用/ JSON
MIMETYPE：应用/ JSON的，
成功：函数（响应）{
警报（JSON.stringify（响应））;
$（＃studList）的HTML（JSON.stringify（响应））。
}，
错误：功能（数据，状态，ER）{
警报（错误：+数据+状态：+状态+ER：+ ER）;
}
}）;
}）;
}）;
$（文件）。就绪（函数（）{
警报（的document.getElementById（'studentName）VAL（））;
}）;
无功电流=的document.getElementById（'studentName'）值（）。
currnet.value = c为C：超时值=$ {}工资/＆GT;
＆LT; / SCRIPT＆GT;
控制器
@ResponseBody @RequestMapping（值=/ byCollege，方法= RequestMethod.POST，产生= MediaType.APPLICATION_JSON_VALUE）
公开名单＆LT; OneStudentResult＆GT; filterByColl（@RequestBody OneStudentResult oneStudentResult，ModelMap模型）{
ModelAndView中的ModelAndView =新的ModelAndView（）;
字符串DEPTNAME = NULL;
名单= resultService.getStudentByColl（oneStudentResult.getName（），oneStudentResult.getCollName（））;
迭代器＆LT; OneStudentResult＆GT; ITR = nameList.iterator（）;
设置＆LT;字符串＆GT; uniqueDeptList =新TreeSet的＆LT;字符串＆GT;（）;
而（itr.hasNext（））{
的System.out.println（itr.next（）的getName（））;
}
uniqueDeptList.add（选择一个部门）;
model.addAttribute（uniqueDeptList，uniqueDeptList）;
model.addAttribute（名单，名单）;
modelAndView.addObject（名单，名单）;
返回名单;
}
设置＆LT;字符串＆GT; uniqueDeptList =新TreeSet的＆LT;字符串＆GT;（）;
而（itr.hasNext（））{
DEPTNAME = itr.next（）getDeptName（）。
如果（！uniqueDeptList.contains（DEPTNAME））{
uniqueDeptList.add（DEPTNAME）;
}
}
uniqueDeptList.add（选择一个部门）;
model.addAttribute（uniqueDeptList，uniqueDeptList）;
model.addAttribute（名单，名单）;
返回nameResult;
}
其实AJAX调用的目的是更新中使用AJAX的JSP JSTL。
PS：截至目前，我可以看到我的旧表将离去，我看这是我名单如下：
[{REGNO：1234，名：ABCD，collName：工程学院，DEPTNAME：BE电子与通信工程，结果：空，SUBJ code：空，subjName：空，品位：空，结果：空}]
解决方案
有一个问题，我可以看到，您使用的的 uniqueDeptList 的作为列表的名称这是从控制器发送，一个要在 VAR =uniqueDeptList的，这很可能是casuing问题，请尝试使用不同的标识符像<使用相同的名称STRONG>的 VAR =uniqueDeptListCurrentItem的
＆LT;选择一个id =byDeptNAME =byDept＆GT;
c为C：的forEach项=$ {uniqueDeptList}变种=uniqueDeptListCurrentItem＆GT;
＆LT;期权价值=$ {uniqueDeptListCurrentItem}＆GT;
$ {uniqueDeptListCurrentItem}＆LT; /选项＆GT;
＆LT; / C：的forEach＆GT;
＆LT; /选择＆GT;
Following is the AJAX code where I select a value in dropdown and I get a List back from controller. When I get the list back, I want to update the c:forEach item using the AJAX result.
AJAX
<script>
$(document).ready(function() {
$("#byCollege").change(function() {
// Get and convert the data for sending
// Example: This variable contains the selected option-text
var collName = $('#byCollege').val();
var studentName = '${salary}';
var json = {"name" : studentName, "collName" : collName};
// Send the data as an ajax POST request
$.ajax({
url: "http://localhost:8080/AnnaUnivResults/mvc/byCollege",
type: 'POST',
dataType: 'json',
data: JSON.stringify(json),
contentType: "application/json",
mimeType: 'application/json',
success: function(response) {
alert(JSON.stringify(response));
$("#studList").html(JSON.stringify(response));
},
error: function(data, status, er) {
alert("error: " + data + " status: " + status + " er:" + er);
}
});
});
});
$(document).ready(function() {
alert(document.getElementById('studentName').val());
});
var current = document.getElementById('studentName').value();
currnet.value = <c:out value="${salary}"/>
</script>
Controller
@ResponseBody @RequestMapping(value = "/byCollege", method = RequestMethod.POST, produces = MediaType.APPLICATION_JSON_VALUE)
public List<OneStudentResult> filterByColl(@RequestBody OneStudentResult oneStudentResult, ModelMap model){
ModelAndView modelAndView = new ModelAndView();
String deptName = null;
nameList = resultService.getStudentByColl(oneStudentResult.getName(), oneStudentResult.getCollName());
Iterator<OneStudentResult> itr = nameList.iterator();
Set<String> uniqueDeptList = new TreeSet<String>();
while(itr.hasNext()){
System.out.println(itr.next().getName());
}
uniqueDeptList.add(" Select a Department ");
model.addAttribute("uniqueDeptList", uniqueDeptList);
model.addAttribute("nameList", nameList);
modelAndView.addObject("nameList", nameList);
return nameList;
}
Set<String> uniqueDeptList = new TreeSet<String>();
while(itr.hasNext()){
deptName = itr.next().getDeptName();
if(!uniqueDeptList.contains(deptName)){
uniqueDeptList.add(deptName);
}
}
uniqueDeptList.add(" Select a Department ");
model.addAttribute("uniqueDeptList", uniqueDeptList);
model.addAttribute("nameList", nameList);
return "nameResult";
}
Actually the purpose of the AJAX call is to update the in jstl of jsp using AJAX.
PS: As of now I could see my old table going away and I see this my List as follows
[{"regNo":"1234","name":"ABCD","collName":" COLLEGE OF ENGINEERING","deptName":"B.E. Electronics and Communication Engineering","results":null,"subjCode":null,"subjName":null,"grade":null,"result":null}]
解决方案
There is one problem that I can see, you are using uniqueDeptList as the name of the list that is being sent from the controller, an you are using the same name in var="uniqueDeptList", this probably is casuing an issue, try using a different identifier like var="uniqueDeptListCurrentItem"
<select id="byDept" name="byDept" >
<c:forEach items="${uniqueDeptList}" var="uniqueDeptListCurrentItem">
<option value="${uniqueDeptListCurrentItem}">
${uniqueDeptListCurrentItem}</option >
</c:forEach >
</select >
这篇关于在Spring项目中使用Ajax的forEach：如何更新交流？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
