我正在使用Spring-MVC 4.3.7,并尝试使用AJAX发布请求在JSP中编辑用户数据,并将结果保存在mySql中。该表单采用Bootstrap模式。
我可以将表单数据发送到Spring控制器(已更改的用户数据已打印在服务器日志中),但AJAX始终显示错误警报,并且该控制器不会在mySql中更新用户数据。
<form id="editForm">
<div class="form-group">
<label for="editName">Name</label>
<input type="text" class="form-control" name="editName" id="editName" value="">
</div>
<div class="form-group">
<label for="editUsername">Username</label>
<input type="text" class="form-control" name="editUsername" id="editUsername" value="">
</div>
<div class="form-group">
<label for="editRole">Role</label>
<select id="editRole">
<option value="0">User</option>
<option value="1">Admin</option>
</select>
</div>
<div class="modal-footer">
<div class="btn-group btn-group-justified" role="group" aria-label="group button">
<div class="btn-group" role="group">
<button type="button" class="btn btn-
danger" data-dismiss="modal" role="button">Close</button>
</div>
<div class="btn-group" role="group">
<button type="submit" class="btn btn-
success btn-hover-green">Save</button>
</div>
</div>
</div>
</form>
$("#editForm").submit(function(event) {
// Prevent the form from submitting via the browser.
event.preventDefault();
// PREPARE FORM DATA
var formData = {
name: $("#editName").val(),
username: $("#editUsername").val(),
role: $("#editRole").val()
};
var dataJson = JSON.stringify(formData);
$.ajax({
type: "POST",
contentType: "application/json",
url: "../admin/editUser",
data: dataJson,
dataType: 'json',
success: function(data) {
alert("Success");
console.log(data);
},
error: function(e) {
alert("Error!");
console.log(e);
}
});
});
@Autowired
UserService userService;
@RequestMapping(value = "admin/editUser", method = RequestMethod.POST)
public @ResponseBody void handleEditUser(@RequestBody User cmd) {
try {
System.out.println(cmd.getName());
System.out.println(cmd + "done");
userService.updateUser(cmd);
} catch (DuplicateKeyException ex) {
ex.printStackTrace();
}
}
我测试了updateUser
方法,效果很好。
我希望有人可以为我提供解决方案和对我的问题的解释,我在此错误上停留了2天,并且尝试了许多不同的解决方案,但无法正常工作。谢谢!
答案 0 :(得分:0)
我找到了解决问题的方法:
第一个问题是Ajax请求中的dataType我在这里找到了解决方案和解释 https://stackoverflow.com/a/6186905/10236226
第二个问题是我忘了在Modal的formData中添加userId,因此添加了 代码:
id: $("#modalId").data('id')
一切正常,发送的数据保存到mysql。我希望这可以帮助 将来的人。