首页 > 语言 > JavaScript > 正文

jquery+ajax验证不通过也提交表单问题处理

2024-05-06 14:49:20
字体:
来源:转载
供稿:网友

validationEngine给我们为前端的表单验证减少了很大的工作量.大部分情况我们使用validationEngine验证表单的形式有几种方式:

1 使用正常的表单提交.这种情况validationEngine验证不通过是不会提交表单的.

2 使用ajax提交表单,但是没有使用ajax验证.

         这种方式也比较简单,在我们使用ajax请求前检查验证是否通过就可以,例如:

代码如下:
//验证不通过时return 
    if(!$("form#ajaxForm").validationEngine("validate")) return ; 
    $.ajax({ 
       type: "POST", 
       url: $("#ajaxForm").attr("action"), 
       data: $("#ajaxForm").serialize(), 
       dataType: "html", 
       success: function(data){ 
          xxxx     } 
    }); 

3 使用正常表单提交,但是有使用ajax验证,这种方式有点让人纠结了.当我们提交表单时ajax验证不通过也能提交表单,关于这种情况,网上很多例子是改源码的,下面是截图:

.这种方法对于目前这种情况可行,这种修改的方式本身就不建议,可能对其它地方产生影响.我发现的其中一个就是当下面这种情况时:

代码如下:
function beforeCall(form,options){ 
    if(window.console){ 
        console.log("表单提交验证通过后,Ajax 提交之前的回调"); 
    }; 
    return true; 
}; 
//  
function ajaxValidationCallback(status,form,json,options){ 
    if(window.console){ 
        console.log(status); 
    }; 
    if(status === true){ 
        alert("the form is valid!"); 
    } 
}; 
jQuery(document).ready(function(){ 
    jQuery("#formID").validationEngine({ 
        ajaxFormValidation: true,  //是否使用 Ajax 提交表单 
        ajaxFormValidationMethod: 'post',  //设置 Ajax 提交时,发送数据的方式 
        onAjaxFormComplete: ajaxValidationCallback,  //表单提交,Ajax 验证完成后 
        onBeforeAjaxFormValidation: beforeCall  //表单提交验证通过后,Ajax 提交之前的回调 

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选