在练习项目时候,发现一个问题,ajax怎么提交form表单呢?这个貌似很简单,但是如果表单数据很多怎么办?为了提高工作效率,我们会想到整体提交,有这样的方法:
方法一:用FormData方法:
var formdata=new FormData(document.getElementById("myform"));
然后再用ajax提交。当然这里的myform是form表单的id。
但是,发现一个问题,这个方法有两个不好的地方:1、可以整体提交,但是后台不能整体接收,2、有些浏览器不支持
方法二:
这个更简单,且很好的解决了上面的两个问题:
function add(){
$("#myfrom").ajaxSubmit();
}
<form id="myfrom" action="${pageContext.request.contextPath }/contact/some.do" method="post">
后台怎么接收呢?用实体类,但是实体类的字段名必须与form表单里的name一致,直接看代码:
@RequestMapping(value="/some.do",method=RequestMethod.POST)
@ResponseBody
public void test(HttpServletRequest request,Contact contact) throws IOException{
System.out.println(contact);
service.saveContact(contact);
ModelAndView mv = new ModelAndView();
//System.out.println(formdata);
//System.out.println(name);
//System.out.println(sex);
System.out.println("=============");
mv.addObject("message", "成功!!");
//System.out.println(name);
//mv.setViewName("/html/address_list/selectAddressBook.jsp");
}
但还是发现了个问题,就是有空值的话不能提交,那么我们可以用js的表单验证来解决。