form表单提交

1、submit提交：

在form中需要添加action（url）以及method（POST）属性，定义一个提交按钮，并与form绑定。

缺点：整个页面会跳转，需要进行额外的处理

例如：

<form id="form1" action = "...... " method="post" class="form">
    </form>
<input type="button" id="submit_save" class="btn_blue" value="保 存">
    
//绑定 
$(function(){
    	$("#submit_save").on("click",submitPicPath);
});

function submitPicPath(){
    $('#form1').submit(function(data){
        //回调函数
    }).submit();
} 
    

这个方法不建议使用。

2、ajax提交：

将form表单内容序列化，再使用ajax将表单内容提交给后台。

<form id="form1" class="form">		
</form>
<input type="button" id="submit_save" class="btn_blue" value="保 存">
   
$(function(){  					 //绑定 
    $("#submit_save").on("click",submitPicPath);
});
function submitPicPath(){
            $.ajax({
                        type : "post",
                        url : "${base}/config/saveConfig",
                        data : $('#form1').serialize(),
                        dataType: "json",
                        success : function(tips) {
                            $.messager.alert('提示', tips.text, 'info');
                        }
                    });
}

这是最理想的表单提交方式。

3、ajaxsubmit:

ajaxSubmit()提交表单，使用第三方插件jquery.form实现。

<form id="form1" class="form">		
</form>
<input type="button" id="submit_save" class="btn_blue" value="保 存">
   
$(function(){  					 //绑定 
    $("#submit_save").on("click",submitPicPath);
});
function submitPicPath(){
	        $('#form1').submit(function () {
                $(this).ajaxSubmit({
                    url: '${base}/pictureup/saveJudge',
                    type: 'post',
                    success: function (tips) {

                        closeWaitDialog();
                        $.messager.alert('提示', tips.text, 'info');
                    },
                    dataType: 'json'
                });
            return false;		//阻止表单默认提交
        }).submit();
}