jQuery表單序列化 - 只是返回一個空字符串

Question

我沒有從序列化我的html表單獲取任何數據。這裏是形式

<form method="post" action="#" name='basicForm' id='basicForm'> 

<input type="text" name="n_username" id="id_username" class="form-control uname" placeholder='Username' value='test_user' data-msg-required='The input field is required.' data-rule-required='true'/> 

<input type="password" name="n_password" id="id_password" class="form-control pword" placeholder='Password' value='xxxx' data-msg-required='The input field is required.' data-rule-required='true'/>     

<button class="btn btn-success btn-block">Sign In</button> </form> 

，這裏是jQuery的

jQuery(document).ready(function(){ 
    $("#basicForm").validate({ 

     submitHandler: function (form) { 
      var request; 
      var $form = $(this); 

      var $inputs = $form.find("input, select, button, textarea"); 

      var serializedData = $form.serialize(); 
      alert (serializedData); <==empty 

      $inputs.prop("disabled", true); 

      request = $.ajax({ 
       url: "./ajax/login.php", 
       type: "post", 
       data: serializedData 
      }); 

      request.done(function (response, textStatus, jqXHR) { 
       // log a message to the console 
       console.log("Hooray, it worked!"); 
       alert(response); 
       //window.location.replace("success.php"); 
      }); 
     } 


    }); //validate 

});//ready 
</script> 

表單中的數據不被序列化。我收到一個空的警報框。另外，AJAX頁面上我回發到我的print_r $ _POST數組，並得到這樣的：陣列（）

我已經檢查了表單元素有這似乎是常見的問題名稱。我正在使用這個jQuery版本

驗證工作正常。這也適用於您的幫助

var x = $("#id_username").val(); 
var y = $("#id_password").val(); 
request = $.ajax({ 
       url: "./ajax/login.php", 
       type: "post", 
       //data: serializedData 
       data : { 
        username : x, 
        password: y 
        } 

感謝您能給

Answer 1

您在這裏打破它......

submitHandler: function (form) { 
    ... 
    var $form = $(this); // <- '$(this)' is meaningless 
    ... 
    var serializedData = $form.serialize(); 
    ... 

有這個範圍內沒有$(this)，所以你$form是空。

因爲代表form對象form爭論已經由開發商提供的，這個版本工作得很好......

submitHandler: function (form) { 
    var serializedData = $(form).serialize(); 
    ... 

工作演示：http://jsfiddle.net/gpaf8187/

注意：你」在你的<button>元素中還需要type="submit"，否則驗證插件不會接收此事件。