jQuery $ .ajax函數不會從$（...）獲取數據validate function

Question

我在嘗試將jQuery驗證（插件）和使用ajax將數據發送到服務器時遇到了以下麻煩。

如果我使用這種jQuery方法只將數據發佈到服務器上，一切都可以。

function doAjaxPost() { 
    // get the form values 
    var name = $('#name').val(); 
    var pswd = $('#pswd').val(); 

    $.ajax({ 
    type: "POST", 
    url: "${pageContext. request. contextPath}/loginUser.htm", 
    data: "name=" + name + "&pswd=" + pswd, 

    success: function(response){  
     // we have the response 
     if(response.status == "OK") { 
      $('#info').html("User has been added to the list successfully.<br>"+ 
           "The User Details are as follows : <br> Name : "+ 
           response.result.name + " <br> Password: " + response.result.pswd); 
      $('#name').val(''); 
      $('#pswd').val(''); 
     } else { 
      $('#info').html("Sorry, there is something wrong with the data provided") 
     } 
    }, 
    error: function(e){ 
     alert('Error: ' + e); 
    } 
    }); 

}// end of doAjaxPost 

但是當我試圖用jquery.validate.min.js來驗證用戶的輸入，從服務器的響應向我表明一切正常，但名和密碼的值undefinded我懷疑我的方法doAjaxPost（）無法從jquery.validator之後的表單中提取數據。 這裏是我的驗證功能：

$(document).ready(function(){ 
     $("#loginform").validate({ 

      submitHandler: function(form) { 
       doAjaxPost(); 
      }, 

      rules:{ 
       name:{ 
        required: true, 
        minlength: 4, 
        maxlength: 16, 
       }, 
       pswd:{ 
        required: true, 
        minlength: 6, 
        maxlength: 16, 
       }, 

      }, 
      messages:{ 
       name:{ 
        required: "Login - is a mandatory field", 
        minlength: "Name should contain minimum {0} symbols", 
        maxlength: "Maximum symbols - {0}", 
       }, 
       pswd:{ 
        required: "Password - is a mandatory field", 
        minlength: "Password should contain minimum {0} symbols", 
        maxlength: "Password should contain maximum {0} symbols", 
       }, 

      }, 

     }); 

    }); 

所以我的問題是如何從驗證表單中提取數據，並將其傳遞給doAjaxPost功能？

當我想到這些變量得到什麼形式

var name = $('#name').val(); 
var pswd = $('#pswd').val(); 

也許我應該使用像$選擇器（「＃＃NAME登錄表單」）？我試過了，它不起作用。請幫忙。

Answer 1

報價OP：

「？所以我的問題是如何從驗證表單中提取數據，並將其傳遞給 功能doAjaxPost」

內插件的submitHandlerUse jQuery .serialize()，把你的ajax。

As per the documentation for the Validate plugin，該submitHandler回調函數是：

「回調處理實際當表單有效提交獲取 形式作爲唯一的參數替換默認提交右 地方。驗證後通過Ajax提交表單。「

試試這個代碼，假設你ajax功能是正確的：

$(document).ready(function() { 

    $('#myform').validate({ // initialize the plugin 
     // your rules & options, 
     submitHandler: function (form) { 
      //var name = $('#name').val(); // use serialize 
      //var pswd = $('#pswd').val(); // use serialize 
      $.ajax({ 
       type: "POST", 
       url: "${pageContext. request. contextPath}/loginUser.htm", 
       //data: "name=" + name + "&pswd=" + pswd, // use serialize 
       data: $(form).serialize(), 
       success: function (response) { 
        // we have the response 
        if (response.status == "OK") { 
         $('#info').html("User has been added to the list successfully.<br>" + 
          "The User Details are as follows : <br> Name : " + response.result.name + " <br> Password: " + response.result.pswd); 
         $('#name').val(''); 
         $('#pswd').val(''); 
        } else { 
         $('#info').html("Sorry, there is something wrong with the data provided") 
        } 
       }, 
       error: function (e) { 
        alert('Error: ' + e); 
       } 
      }); 
      return false; // blocks redirect after submission via ajax 
     } 
    }); 

}); 

DEMO：http://jsfiddle.net/Cdvqw/

編輯：OP已經有他的外部ajax功能從內插件的submitHandler稱爲。