Question

在确认我们的数据库中是否存在电子邮件后，我正在使用此form validator和ajax();来填写将会显示的叠加层。 php文件将确定是否显示注册或登录表单。

我目前的问题是，如果有人点击提交按钮（没有填写任何内容），到达时，将进行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，但需要2次点击才能识别更改后的值。

我已经尝试将验证分配给变量，因此它将作为条件语句的一部分。

我的想法已经用完了，有人可以救我吗？的xD 哦，我也搜索了很多，但我认为爬虫病了：p

Answer 1

好的，我终于做了一些实际上有我想要的效果的东西。虽然我觉得应该能够在验证的onSuccess事件中调用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;
    }
});

如果有人找到了更简单的方法，或者可以解释为什么我必须通过这个过程来获得这个结果，我将不胜感激。

带有ajax（）调用的表单验证器不执行验证

1 个答案: