【发布时间】：2013-08-19 22:12:19
【问题描述】：
我有一个问题，javaScript 如何将两个单独的列表传递给 spring 控制器。在我的 freeMarker 模板上，我选择了更改两个列表的集合。 这是两个列表的渲染：
编辑：我发现 Jquery 有 Ui plagin
.sortable("toArray", { key: "id" })
方法，所以我将Id值添加到
<div class="span5" id="listBox">
<h3>Assigned Servers</h3>
<#if assignedServers?has_content>
<ul id="sortable1" class="connectedSortable">
<#list assignedServers as responsible >
<li class="ui-state-default"
id="${responsible.id}" >${responsible.server_name}</li>
</#list>
</ul>
<#else>
<h4>This employee have no assigned servers yet.</h4>
</#if>
</div>
<div class="span5" id="listBox">
<h3>Available Servers</h3>
<#if availableServers?has_content>
<ul id="sortable2" class="connectedSortable">
<#list availableServers as available >
<li class="ui-state-default"
id="${available.id}" >${available.server_name}</li>
</#list>
</ul>
<#else>
<h4>There is no available servers to assign.</h4>
</#if>
</div>
已编辑：我更改了 JQuery 函数：
<script>
$(function() {
var assigned = "";
var available = "";
$('#sortable1').sortable({
connectWith: '#sortable2',
update: function(event, ui) {
assigned = $(this).sortable("toArray", { key: "id" });
}
}).disableSelection();
$('#sortable2').sortable({
connectWith: '#sortable1',
update: function(event, ui) {
available = $(this).sortable("toArray", { key: "id" });
}
}).disableSelection();
$('#assign').click(function(){
$.ajax({
type: "POST",
url: "/ServerMonitoring/employee_management/serv_assignment/2",
data: JSON.stringify({
serversListModel: {
"assignedServers": assigned,
"availableServers": available
}
}),
datatype: "jsondata",
contentType: 'application/json',
success: function(data) {
alert("Success");
},
error: function (e) {
alert("Error: " + e);
}
});
return false;
});
//debugger
});
</script>
已编辑：这是我的新弹簧控制器：
@RequestMapping(value = "/{id}", method = RequestMethod.POST)
public @ResponseBody ModelAndView onSubmit(
@ModelAttribute("serversListModel") ServersListModel serversListModel,
@PathVariable("id") Long responsibleId,
BindingResult result,
HttpServletRequest request,
HttpServletResponse response,
SessionStatus status) throws ParseException {
if (!result.hasErrors()) {
if (serversListModel.getAvailableServers() != null) {
for (String id : serversListModel.getAvailableServers()) {
ServerEntity entity = employeeService.getServerById((long)Integer.parseInt(id));
entity.setResponsible(responsibleId);
adminService.updateServer(entity);
}
}
if (serversListModel.getAssignedServers() != null) {
for (String id : serversListModel.getAssignedServers()) {
ServerEntity entity = employeeService.getServerById((long)Integer.parseInt(id));
entity.setResponsible((long) 0);
adminService.updateServer(entity);
}
}
status.setComplete();
return new ModelAndView("redirect:/employee_management/employee_manager");
} else {
response.setStatus(HttpServletResponse.SC_BAD_REQUEST);
return new ModelAndView("redirect:/employee_management/serv_assignment");
}
}
已编辑：新的 ServersListModel - 这是一个带有两个变量的简单 POJO
public class ServersListModel {
private List<String> assignedServers;
private List<String> availableServers;
...
}
通过在 FireBug 中调试可以发现 JSON 正在传递字符串：
{"serversListModel":{"assignedServers":["2","4"],"availableServers":["1","5","3","6","7","8"]}}
但是，我仍然没有设法修改该字符串，我的模型中的变量在调试时仍然包含 NULL。 将 @RequestBody 注释放在 @ModelAttribute("serversListModel") 的位置会使 Jquery 抛出 BadRequest 错误。 如果在方法体内，我调用
String jsonBody = IOUtils.toString(request.getInputStream());
它将返回带有请求 id 的 JSON 字符串对象，所以我很想回答。
请帮我找出Controller中的错误。谢谢。
【问题讨论】：
-
你的控制器方法是什么样的？
-
@superEb，我添加了控制器代码。
-
POST 请求的正文是什么样的？ （使用 HTTP 代理捕获请求，例如 Chrome Dev Tools、Fiddler2 或 Charles）我不确定 jQuery 如何将您的 JSON 对象转换为 application/x-www-form-urlencoded 但我我猜测 jQuery 发送的内容与您的控制器期望的内容不匹配。
-
因此您可能必须在 JavaScript 中进行自己的表单绑定/转换，并将
processData设置为 false，或者只是 POST JSON，并可能在控制器中使用@RequestBody而不是@ModelAttribute。
标签： java javascript jquery spring-mvc freemarker