form submit提交遇到的问题

因为公司业务需要,有一个提交的功能,提交的时候要上传文件,后端是用JAVA写的。用的是Form表单手动提交方式,如果用IE后台不到任何数据,firefox是可以的,但是不管是IE还是firefox,后台请求都会打开一个新的空白页面(速度很快时firefox看不出来)。而我想要的功能是提交完后就把当前页面关闭了,而不是打开一个新的空白页面。

下面是html代码,当然经过我修改过的,把出错的情况和正确的都列出来了,submit1和submit2

 1 <!DOCTYPE html>
 2 <html>
 3 <body>
 4 <form  id="frmChild" enctype="multipart/form-data" onsubmit="return checkForm();">
 5  <input id="txtLocation"  name="locationvalue" type="file" size="50"/>
 6  <textarea cols="50" rows="5" id="comment" name="comment"></textarea>
 7 <input type="submit" name="submit" value="submit1"/>
 8 <button type="button" onclick="operator()">submit2</button>
 9 </form>
10 </body>
11 </html>

1.IE浏览器提交 获取不到值的情况,即submit2,是在operator()方法中拼URL,然后手动提交,代码如下:

function operator(){
    form.method="POST";
    form.action="/file/show-file?pid=" + pid + "&wid=" + wid ;   
    form.submit();    
}

 这种方式iE提交后台取不到值,不知道具体原因是什么,问了一下公司的牛人,说:form表单存在上传文件的提交过程,会自动提交一些与表单相关的数据,比如表单头什么的,手动提交的话会出现不可预知的错误,更别提IE6了,最好的方法是在表单中submit直接自动提交。

2.解决1的问题,既用submit1的方式。首先在form标签中写清楚method等信息,如:<form action="/file/submit-file" method="post" id="frmChild" enctype="multipart/form-data" onsubmit="return checkForm();">

把要传的数据用<input type="hidden">隐藏在页面中,后台就可以一起获得数据了,不需要自己拼URL,在<form>中用onsubmit="return checkForm();"的原因是在提交之前要对表单数据进行一个验证,必须return一个值(true/false),如果返回的是false,表单就不提交了,如果return的是true,则表单继续自动提交。

3.需要注意的点:

  (1).上传文件在表单中必须写明enctype="multipart/form-data",默认是"application/x-www-form-urlencoded"(没有上传文件时用),这是表单的MIME编码。有上传文件时不能用ajax请求提交数据 

   (2).表单提交到一个URL,默认会打开URL这个页面,不过不想打开这个页面的话,自动提交可能实现不了,为解决问题,可以在后端让页面跳转到一个想要的页面

 

posted @ 2012-12-11 11:08  RedAngel  阅读(1555)  评论(2编辑  收藏  举报