作为程序员一定要保持良好的睡眠,才能好编程

jquery 中一个重要的功能表单 通过ajaxsubmit 进行提交

发布时间:2018-01-15

近日在做一个相当高大上的项目中,使用到了jquery validate 控件


验证完毕后,部分表单需要进行ajax进行提交,那么应该怎么操作?


下面我给出一个案例


$("#form-member-add").validate({
    rules:{
        title:{
            required:true
        },
        module:{
            required:true
        },
        controller:{
            required:true
        },
        action:{
            required:true
        }
    },
    onkeyup:false,
    focusCleanup:true,
    success:"valid",
    submitHandler:function(form){
        $(form).ajaxSubmit({
            success:function(responseData){

                if(responseData.statusCode==ToolsUI.statusCode.ok){
                    //成功
                    layer.msg(responseData.message, {
                        icon: 1,
                        time: 2000 //2秒关闭(如果不配置,默认是3秒)
                    }, function(){
                        //获取弹出窗口,然后进行刷新页面
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.$('.btn-refresh').click();
                        parent.layer.close(index);
                    });
                }else{
                    layer.alert(responseData.message, {icon:2},function(index){
                        layer.close(index);
                    });
                }
                //console.log(responseData);

            },
            dataType:"json"
        });

    }
});


好的,那么 ajaxsumbit中的参数是什么呢?


option的参数 

var options = {    

       target:        '#output1',   // target element(s) to be updated with server response    

       beforeSubmit:  showRequest,  // pre-submit callback    

       success:       showResponse  // post-submit callback    

  

       // other available options:    

       //url:       url         // override for form's 'action' attribute    

       //type:      type        // 'get' or 'post', override for form's 'method' attribute    

       //dataType:  null        // 'xml', 'script', or 'json' (expected server response type)    

       //clearForm: true        // clear all form fields after successful submit    

       //resetForm: true        // reset the form after successful submit    

  

       // $.ajax options can be used here too, for example:    

       //timeout:   3000    

   };