[英]How do i pass an object from jsp to controller with spring
I have a class User and a class Project wich has an arraylist with users. 我有一个User类,一个Project类具有与用户的arraylist。 I have a Project page with a list of all my projects and when i click on one, it takes me to the page of that project by sending the id of that project in the url.
我有一个包含所有我的项目列表的“项目”页面,当我单击一个项目页面时,通过在url中发送该项目的ID将其带到该项目的页面。
On my detail project page i want to add users that i created. 在我的详细项目页面上,我想添加我创建的用户。 The users are displayed on a modal in a table with a button to add them.
用户显示在表格中的模态上,并带有一个添加按钮。
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title"></h4>
</div>
<div class="modal-body">
<h1 class="text-center">UserList</h1>
<br><br>
<table class="table table-hover">
<thead>
<tr>
<th>Photo</th>
<th>Firstname</th>
<th>Lastname</th>
<th>Function</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<c:forEach var="u" items="${users}">
<tr>
<td><img src="${u.getPhoto()}"
alt="Alternate Text" class="img-responsive" /></td>
<td>${u.getFirstname()}</td>
<td>${u.getLastname()}</td>
<td>${u.getFunction()}</td>
<td>${u.getEmail()}</td>
<td><Button type="Button" class="btn btn-default">Add</button></td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
</div>
</div>
</div>
My question is how do i send the id of the user and the id of the project i want them to be added to my controller? 我的问题是如何发送用户ID和我希望他们添加到控制器的项目ID?
I know i can pass an id with the url but i dont want to open a new page. 我知道我可以使用网址传递ID,但是我不想打开新页面。
I want to send the ID of the user and the project to my controller by clicking on the add button to my controller so i can use those in my method called addUserToProject() 我想通过单击控制器上的添加按钮将用户和项目的ID发送到控制器,以便可以在名为addUserToProject()的方法中使用这些ID
在呈现的页面上,您只有两个选项,要么进行常规表单发布,要么如果不想打开新的URL,请使用Ajax。
JSP JSP
First, make a hidden input with selected project id, so you can get it later: 首先,使用选定的项目ID进行隐藏输入,以便稍后获取:
<input type="hidden" id="currentProjectId" value="12">
Second, set attribute name of add buttons equal userId : 其次,将添加按钮的属性名称设置为等于userId :
<td><Button type="Button" name="${u.getId()}" class="btn btn-default">Add</button></td>
Javascript: Javascript:
Define onclick linstener for each "add button" and get the current user id from the button: 为每个“添加按钮”定义onclick linstener并从该按钮获取当前用户ID:
$(".btn").click(function(event) {
event.preventDefault();
var currentProjectId= $('#currentProjectId').val();
var userId = $(this).attr("name");
addUser(currentProjectId, userId);
});
Make ajax request and post the ids to controller: 发出ajax请求并将ID发布到控制器:
function addUser(currentProjectId, selectedUserId) {
$.ajax({
type : "POST",
contentType : "application/json",
url : "/addUserToProject",
data :{ projectId: currentProjectId, userId: selectedUserId},
dataType : 'json',
timeout : 100000,
success : function(data) {
console.log("SUCCESS: ", data);
},
error : function(e) {
console.log("ERROR: ", e);
display(e);
},
done : function(e) {
console.log("DONE");
}
});
}
Finally, controller accepts ids using @RequestParam: 最后,控制器使用@RequestParam接受ID :
@RequestMapping(value = "/addUserToProject", method = RequestMethod.POST,produces = MediaType.APPLICATION_JSON_VALUE)
public @ResponseBody
String Submit(@RequestParam("projectId") Integer projectId ,@RequestParam("userId ") Integer userId ) {
//insert user
return "ok";
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.