Html Form 表单提交

简单的form表单需要写篇博文吗？是的，在泥坑里爬过还是要一一记录下，以防下次再遇到不用再去试错.可以节省大量时间。

一个form表单提交，只需要$(‘#form’).submit()；不就可以完成了吗？这样单纯的提交是没任何问题的，但如果还需要关闭form、刷新父页面这样是行不通的。同时加了刷新父页面和关闭本窗口,窗口是不会关闭的，所以只有用另一种方式

此方式除了需要引入jQuery.js，还需要JQuery-form.js，当然最好还是直接ajax提交

具体步骤：

1.引入文件

  <%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-1.7.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>js/jquery-form3.5.js"></script>

2.编写JS脚本

var opinion =  encodeURI(encodeURI(desc));

$("form").ajaxSubmit({  
            type: 'get',  
            url: "<%=basePath%>****Action.do?operation=updateState&formBO.oid="+formID
            +"&formBO.formNo="+formNO+"&opinion="+opinion,
            dataType: "json",
           /*  data:{

                opinion:opinion
                此处传数据，后台接收不到值，还未找到原因，只能通过URL传参
            }, */
            success: function(data){
                alert("保存成功");
                window.opener.queryList();//调用父窗口的查询方法
                window.close();//关闭本窗口
            },
           error: function(data)
            {
                alert("保存成功");
            }
         });

3.<form enctype="multipart/form-data">//增加此属性值

这样数据就可以在后台接收到。但有个问题就是URL传中文是会有乱码的。又是各种纠结，最后找到了解决方式

1在前端把需要传中文的字符串编码

opinion =  encodeURI(encodeURI(desc));//两次编码 （为什么两次编码，在扩展里有解释）

2.后台解码

String opinion = java.net.URLDecoder.decode(formBO.getOpinion(),"utf-8");

就可以完成了

 

附：ajax提交

 $.ajax({ 
            type: 'post',  
            url: "<%=basePath%>*Action.do??operation=updateState&formBO.oid="+formID
            +"&formBO.formNo="+formNO+"&opinion="+opinion,
            dataType: "json",
            success: function(data){
                opener.queryDeleveryBatch();
                alert("<bean:message key='ASMS.1907046'/><%//提交成功！%>");
                window.close();
            },
            error: function(data)
            {
                alert("<%/*提交失败*/%><bean:message key="ASM_S.201611140018"/>");
            }
         });

扩展

https://www.cnblogs.com/zhuxiaojie/p/4783939.html

https://blog.csdn.net/xinghuo0007/article/details/72806717

https://www.cnblogs.com/liuslayer/p/4968448.html