表单同时提交多条记录的技术实现
Posted fantongxue
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了表单同时提交多条记录的技术实现相关的知识,希望对你有一定的参考价值。
需求:一个表单可以动态添加,修改以及删除,然后提交,如下图实例。
这里只提及两点即可,其他的可以自己现场发挥。
- js模板
- 表单把数据提交到后台如何接收
一,页面可以使用js
模板来做,点击增加业务类型
按钮,触发事件,然后把js
模板append
到一个元素容器中即可,随便选择一个好用的模板就可以。
二,如何提交到后台?
这里打一个比方,提交多个学生信息。
一个User
实体类
public class User {
private Integer id;
private String name;
private String pwd;
}
表单代码
<form action="/user/submitUserList_1" method="post">
ID:<input type="text" name="id"><br/>
Username:<input type="text" name="name"><br/>
Password:<input type="text" name="pwd"><br/><br/>
ID:<input type="text" name="id"><br/>
Username:<input type="text" name="name"><br/>
Password:<input type="text" name="pwd"><br/><br/>
<input type="submit" value="submit">
</form>
传到后台的java
代码接收,以数组的方式接收,然后对数组进行遍历存数据库即可。
java @RequestMapping(value = "/submitUserList_1", method ={RequestMethod.POST}) @ResponseBody public String submitUserList_1(HttpServletResponse response,Integer[] id, String[] name, String[] pwd) throws Exception{ String result = ""; if(id == null || id.length <= 0){ return "No any ID.中文"; } List<User> userList = new ArrayList<User>(); for (int i = 0; i < id.length; i++ ) { User user = new User(); user.setId(id[i]); user.setName(name[i]); user.setPwd(pwd[i]); userList.add(user); } result = this.showUserList(userList); return result; }
以上是关于表单同时提交多条记录的技术实现的主要内容,如果未能解决你的问题,请参考以下文章