java - 将表单数据绑定为 JSON 字符串/字符串数组以请求字符串中的参数
问题描述
我有一个表格,我想通过 ajax 发送给我的控制器:
<div class="row">
<label for="username" class="col-sm-2 col-form-label my-auto">Username:</label>
<div class="col-sm-10 my-auto">
<input type="text" class="form-control" id="username" name="username">
</div>
</div>
<div class="row">
<label for="password" class="col-sm-2 col-form-label my-auto">Password:</label>
<div class="col-sm-10 my-auto">
<input type="text" class="form-control" id="password" name="password">
</div>
</div>
<div class="row" id="ratingRow">
<label for="adminFoci" class="col-sm-2 col-form-label my-auto">User Rating:</label>
<div class="col-sm-auto my-auto">
<select class="selectpicker" multiple data-live-search="true" name="adminFoci" id="adminFoci" title="Choose Foci">
<c:forEach items="${foci}" var="focus">
<option name="${focus.focusName}" value="">${focus.focusName}</option>
</c:forEach>
</select>
</div>
<div class="col-sm my-auto">
<input type="text" class="form-control" id="rating" name="rating">
</div>
<div class="col-sm-auto my-auto" id="ratingButtonRow">
<div class="btn btn-info btn-sm" id="adminAddGroup">Add Rating</div>
</div>
</div>
<div class="row">
<label for="adminUserGroups" class="col-sm-2 col-form-label my-auto">User's Groups:</label>
<div class="col-sm-auto my-auto">
<select class="selectpicker" multiple data-live-search="true" id="adminUserGroups" name="groups" title="Choose Groups">
<c:forEach items="${groups}" var="group">
<option name="${group.groupName}" value="${group.groupName}">${group.groupName}</option>
</c:forEach>
</select>
</div>
</div>
<div class="row">
<label class="col-sm-2 col-form-label my-auto">User's Roles:</label>
<div class="col-sm-10 my-auto">
<select class="selectpicker" multiple data-live-search="true" id="adminUserRoles" name="roles" title="Choose Roles">
<c:forEach items="${user.roles}" var="role">
<option name="${role.name}" value="${role.name}">${role.name}</option>
</c:forEach>
</select>
</div>
</div>
我捕获表单提交并序列化表单数据:
$("#modalForm").submit(function(e){
e.preventDefault();
var form = $(this);
$.ajax({
type: "POST",
url: form.attr('action'),
dataType: 'json',
contentType: "application/json; charset=utf-8",
data: JSON.stringify($(this).serializeArray()),
success: function(data)
{
table.row('.selected').ajax.reload();
}
});
});
然后我尝试将 json 字符串数组的数据绑定到我的控制器中请求参数:
@PostMapping(value="/AdminCreateUser", consumes = MediaType.APPLICATION_JSON_VALUE)
public void createUser(@RequestParam String username, @RequestParam String password, @RequestParam (required = false) String[] roles,
@RequestParam (required = false) String[] groups){
User user = new User(username, password);
if(roles != null){
Set<Role> roleList = roleService.findRoles(roles);
if(roleList.size() > 0){
user.setRoles(roleList);
}
}
if(groups != null){
Set<Group> groupList = groupService.findGroups(groups);
for(Group group: groupList){
group.addMember(user);
groupRepository.save(group);
}
}
userRepository.save(user);
}
但是我明白了Resolved [org.springframework.web.bind.MissingServletRequestParameterException: Required String parameter 'username' is not present]
。Jackson 不将 json 字符串数组的匹配元素绑定到请求参数吗?如果没有,我该怎么做?我想省去将每个表单字段作为单独数据发送的工作
解决方案
有两种方式。
- 通过使用应用程序/json
像这样修改你的js代码。
$("#modalForm").submit(function(e){
e.preventDefault();
var form = $(this);
//convert form data to json array of Object(name value pair)
data = []
var x = $(this).serializeArray();
$.each(x, function(i, field){
var name = field.name; var value = field.value;
data[i] = {name : value};
});
$.ajax({
type: "POST",
url: form.attr('action'),
dataType: 'json',
contentType: "application/json; charset=utf-8",
data: JSON.stringify(data),
success: function(data)
{
table.row('.selected').ajax.reload();
}
});
});
修改你的控制器
public void createUser(@RequestBody CreateUserDto createUserRequest){
- 如果要使用请求参数,请将 content-type 更改为 multipart/form-data。
推荐阅读
- java - 如何创建没有中心的 JavaFX BorderPane?
- javascript - 离子地理位置类型错误
- c# - Firebase Unity:OrderByChild().StartAt().EndAt() 不返回任何内容
- python - 如何将表单提交重定向到另一个视图
- c - 如何在没有字符串函数的情况下将新字符串分配给 char 数组
- python - 不可散列的类型:停用词的“列表”错误
- matlab - Matlab 中的 repmat 函数不能始终如一地工作?
- android - Fabric 导致 Android Pie 用户崩溃
- php - 请对我的计数功能提供一点帮助。尝试了有关此主题的答案,但没有成功
- r - 将分位数桶应用于行