2012-08-17 27 views
0

我在表單中使用Jquery驗證,並在.on(提交)代碼中使用Ajax函數。jquery驗證然後.onsubmit函數

問題是,即使驗證錯誤,.on(提交)功能仍在運行。

是否有任何類型的「如果驗證成功」代碼添加到驗證代碼以將.on(提交)代碼放入,以便它只在表單正確和驗證後才運行?

這是。對(提交)功能

 $('#valform').on('submit', function (e){ 
    e.preventDefault(); 
    $.ajax({ 
    type: "POST", 
    url: "<?php echo MAXINBOUND_PLUGIN_URL ?>/php/localProxy.php", 
    data: $('#valform').serialize(), 
    success: function (response) { 
      alert('Great!'); 
      // do something! 
    }, 
    error: function() { 
      alert('There was a problem!'); // handle error 
    } 
     }); 
     }); 

,這是驗證碼

$("#valform").validate({ 
    invalidHandler: function(form, validator) { 
     success: function (response) { 
     var errors = validator.numberOfInvalids(); 

     if (errors) { 
      $("#error-message").show().text("Please correct the required field(s)"); 
     } else { 
      $("#error-message").hide(); 
     } 
    }, 
    messages: { 
     agree: { 
      required: "" 
     }, 
     phone1: { 
      required: "" 
     }, 
     address1: { 
      required: "" 
      }, 
    }, 
    rules: { 
     agree: { 
      required: true, 
     }, 
     phone1: { 
      required: true, 
      phoneUS: true 
     }, 
     Address1: { 
      required: true, 
      addr: true, 
      }, 

     }, 

    }); 

回答

1

可以使用jquery valid() method檢查提交的表單是有效的。事情是這樣的......

if ($("#valform").valid()) { 
    // do your ajax stuff 
} 

請注意,有效()當的validate()被調用之前,它的形式纔會工作。

希望這會有所幫助!

+0

這個工作原理除了自動驗證表單權之前頁面加載之前甚至可以輸入任何信息 – user1532944 2012-08-17 03:23:50

+0

嗯。你可以請你的代碼在jsFiddle或類似的?謝謝。 – neo108 2012-08-17 04:14:36

3

您可以使用submitHandler來做ajax調用。所以它只會在通過所有驗證後纔會調用。

$("#valform").validate({ 
    submitHandler: function(form) { 
    //do ajax call 
    } 
})