jQuery驗證：如何在表單有效後發佈（）？

Question

這個工程：

$('#contestform').on('submit', function(e) { 
    $.post('/', $(this).serialize(), function(response){ 
    console.log(response); 
},'json'); 
    e.preventDefault(); 
}); 

和這個作品

jQuery("#contestform").validate(); 

但我無法弄清楚如何讓他們一起工作。我只想在點擊提交併且表單有效的情況下，讓頂層代碼中的內容發生。我試過http://docs.jquery.com/Plugins/Validation/validate#toptions的東西，但我想我沒有明白。我曾經在一點上做過一些工作，但是你必須點擊提交兩次。

有一件事是，如果我可以幫助它，我想保留post（）的東西在一個單獨的函數，因爲這兩部分將來自不同的部分的PHP。

編輯1 試過，不工作（下形式） （由不工作，我的意思是，這是正常提交​​，不阿賈克斯）

function postForm(e) { 
    jQuery.post('/', $(this).serialize(), function(response){ 
    console.log(response); 
},'json'); 
    e.preventDefault(); 
} 
jQuery("#contestform").validate({submitHandler: postForm}); 

EDIT2 嗯，我得到它與jQuery.Form插件 http://www.malsup.com/jquery/form/#ajaxSubmit 仍然，我想知道我在我的代碼上面做錯了什麼。

function showResponse(responseText, statusText, xhr, $form){ 
    console.log(responseText); 
} 
var soptions = { 
     success: showResponse , 
     dataType: 'json' 
     }; 

jQuery("#contestform").validate({ 
    submitHandler: function(form) { 
    jQuery(form).ajaxSubmit(soptions); 
     return false; // always return false to prevent standard browser submit and page navigation 
    } 
}); 

Answer 1

的參數傳遞給submitHandler功能不是一個jQuery事件是形式DOM對象。所以

1. 當你調用e.preventDefault（）時，你的代碼會拋出一個錯誤;
2. 調用$（形式）.serialize（），而不是$（本）.serialize（）

，讓您的工作EDIT1做這個

<script> 
$(function() { 
    $("form").validate({ 
     submitHandler: function (form) { 
      $.post('/your_url/', 
      $(form).serialize(), function (response) { 
       console.log(response); 
      }, 'json'); 
     } 
    }); 
}); 
</script> 

或保持在postForm功能分開

<script> 
$(function() { 

    function postForm(form) { 
     $.post('/your_url/', 
      $(form).serialize(), 
      function (response) { console.log(response); }, 
      'json'); 
    } 

    jQuery("form").validate({ 
     submitHandler : postForm 
    }); 
}); 
</script> 

Answer 2

​​