easyui---表单提交

第一种：用 form 自带属性action 提交

<form action="/servlet/query" method="post" id="myForm">
<input type="text" name="userName" id="userName"/>
<input type="submit" id="btnSubmit" value="提交"/>
</form>

第二种：用 jquery 提交：$("#formid").submit();
jquery提交表单有两种情况：
1：jquery只做提交用。$("form").submit(); 这个的表单提交到什么地方的是更具form元素里面的action属性去定义的。

2：jquery用ajax提交数据。

$.ajax({
type:"post",
url:"xxx.php", // 这里是提交到什么地方的url
data:{}, // 这里把表单里面的数据放在这里传到后台
dataType:"json",
success:function(res){
// 调用回调函数
}
});

第三种：用 ajax 提交：
但如果form表单中数据很多时，不可能一一列出，只需要用
$(‘#yourformid’).serialize()就可以了

$.ajax({
cache: true,
type: "POST",
url: ajaxCallUrl,
data: $('#yourformid').serialize(),// 你的formid
async: false,
error: function(request) {
alert("Connection error");
},
success: function(data) {
$("#commonLayout_appcreshi").parent().html(data);\
}
});

第四种：formData对象

1、创建一个formData对象，把所有属性都append到对象中

var form = new FormData();
  form.append("username","zxj");
  form.append("password",123456);
　$.ajax({
            url:"${pageContext.request.contextPath}/public/testupload",
                type:"post",
                data:form,
                processData:false,
                contentType:false,
                success:function(data){
                    window.clearInterval(timer);
                    console.log("over..");
                }
});

注意：jquery 的form插件中，有内置的formData，直接用，需要序列化，$.param(formData)

第五种：将整个form表单放到formData对象中，formData就会得到这个表单对象里面的所有的参数

function test(){
            var form = new FormData(document.getElementById("tf"));
            $.ajax({
          url:"${pageContext.request.contextPath}/public/testupload",
                type:"post",
                data:form,
                processData:false,
                contentType:false,
                success:function(data){
                    window.clearInterval(timer);
                    console.log("over..");
                },
                error:function(e){
                    alert("错误！！");
                    window.clearInterval(timer);
                }
            });        
            get();//此处为上传文件的进度条
        }

第六种：

jquery的form插件：需要引入 jquery.form.js文件

两种方式：这两种方式都将表单提交提升为ajax方式，不用ajaxSubmit,了解就行

$("#btn").click(function(){

$("#userform").submit();
});
$("#userform").ajaxForm({
type:"post",
url:"servlet1/userServlet?method=save",

})

用ajaxForm

猜你喜欢