帶有ajax（）調用的表單驗證程序不會執行驗證

我使用此form validator和ajax();調用來填充覆蓋圖，然後在確認電子郵件是否存在於我們的數據庫中之後將顯示覆蓋圖。 php文件將決定是否顯示註冊或登錄表單。帶有ajax（）調用的表單驗證程序不會執行驗證

我目前的問題是，如果有人點擊提交按鈕（沒有填充任何東西），ajax調用將被做出並驗證跳過。雖然安全措施已到位，但我寧願讓訪問者在登記表格前測試他的電子郵件，以防他已經是用戶。

我已經測試了這幾種不同的方式，但似乎沒有工作。

其它功能：

//turn overlay on/off 
function overlayOff() {$("#olContainer").html('');$('#overlay').css({ "display":"none" });} 
function overlayOn() {$('#overlay').css({ "display":"block" });}

Ajax調用：

//ajax call 
function loadLoginFormOverlay(form) { 
    event.preventDefault(); // Stop form from submitting normally 
    $("#olContainer").html(''); //Clear result div 
    var values = form.serialize(); // Get some values from elements on the page: 
    $.ajax({ // Send the data using post and put the results in a div 
     url: "../inc/formLogin.php", 
     type: "post", 
     data: values, 
     success: function(){ 
      $("#olContainer").load('../inc/formLogin.php'); 
      overlayOn(); 
     }, 
     error:function(){ 
      $("#olContainer").html('An error occurred while submitting your email, please refresh your browser and try again.<br>We are sorry for the inconvenience.'); 
      $("#olContainer").append('<input name="Close" type="submit" class="buttsubmit" id="olCloseBtn" value="Close" title="Close" />'); 
      overlayOn(); 
     } 
    }); 
}

綁定：

//binding the submit event to the ajax call 
$("#preLoginForm").submit(function(event) { 
loadLoginFormOverlay($(this)); 
}); 

$("#clientForm").submit(function(event) { 
loadLoginFormOverlay($(this)); 
});

驗證：

//executes validation 
$.validate({ 
    form : '#preLoginForm, #clientForm',// Header preLoginForm && clientForm validation and AJAX call on success eventHandler 
    modules: 'security, location', // security for email confirmation, location for country suggestion 
    onModulesLoaded : function() { 
     $('input[name="clCountry"]').suggestCountry(); //activate country suggestion 
    }, 
    onError : function() { 
     return false; //event.preventDefault(); 
    }, 
    onSuccess : function() { 
     return false;//event.preventDefault(); 
    } 
});

我已經嘗試將提交事件綁定在由驗證生成的onSuccess事件中，但ajax調用不會發生。 Found someone with the same problem, not solved.

我試過使用一個布爾值，直到onSuccess事件觸發，將其分配給true，但需要2clicks才能識別修改後的值。

我試着將驗證分配給一個變量，所以它將作爲條件語句的一部分。

我已經跑出了想法，任何人都可以救我嗎？ xD 哦，我也搜索了很多，但我認爲爬蟲病了：p

來源

2014-01-10 Fernando Silva

好吧，我終於做了一件事實際上有我想要的效果。儘管我覺得AJAX調用應該能夠在驗證事件中被調用，所以只有驗證成功時纔會觸發AJAX調用，並且歡迎任何想法。

我所做的，基本上是在提交綁定內測試輸入值的現有電子郵件。這種方式沒有價值的按鈕將無法正常工作。（驗證確實佔了必需的參數，但並不如我所料工作）

代碼改爲：

$("#preLoginForm").submit(function(event) { 
    if ($("#preLoginEmail").val()=="") { 
     return false; 
    } else {  
     loadLoginFormOverlay($(this)); 
     return false; 
    } 
}); 

$("#clientForm").submit(function(event) { 
    if ($("input[name='clEmail']").val()=="" && $("input[name='clEmail_confirmation']").val()=="") { 
     return false; 
    } else {  
     loadLoginFormOverlay($(this)); 
     return false; 
    } 
});

如果有人發現一個簡單的方法來做到這一點，或者可以解釋爲什麼我不得不通過這個過程來獲得這個結果，我將不勝感激。

來源

2014-01-11 15:09:29

帶有ajax（）調用的表單驗證程序不會執行驗證

回答

相關問題