0

こんにちはみんな私の問題を解決するのを手伝ってください。実際、私はjavascriptを使用してフォームの電子メールフィールドを検証し、その電子メールが存在するかどうかを確認するためにajaxリクエストを投稿しようとしていますが、javascript関数はajax応答まで待機せず、毎回falseを返します。メールが存在しない場合はtrueを返したい...

    $(document).ready(function(){
    //global vars
    var form = $("#signupForm");
    var email = $("#email");
    var email_error = $("#invalid");

    //On blur
   // userEmail.blur(validateEmail);

    //On Submitting
    form.submit(function(){

        if(validateEmail()){
            alert("submit true");
            return true;
        }else{
        alert("submit false");
            return false;
            }
    });


    function validateEmail(){
        //if it's NOT valid
        alert("In email");
        var a = $("#email").val();
        var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;

        if(email.val() == ""){
            email_error.html("Please enter your email ");
            return false;
        }
        //if it's valid email
        else if(filter.test(a)==false){
            email_error.html("Please enter Valid email address");
            return false;
        }
        else if(filter.test(a)==true){alert("elseif");
        var baseUrl = '<?= base_url() ?>';

                $.ajax({
                    type: "POST",
                    url: baseUrl+"index.php/index/validateUserEmail",
                    data: "useremail="+$("#email").val(),
                    success: function(msg){
                    alert(msg);
                    if(msg == "1")
                        {
                            $("#tick_cross").fadeIn("slow").html('<img src="'+baseUrl+'images/cross.png" />');
                            $("#emailValidate").val("1");  
                            email_error.html("This email-Id already exists!");
                            return false;
                        }
                        else
                        {

                            $("#tick_cross").fadeIn("slow").html('<img src="'+baseUrl+'images/tick.png" />');
                            $("#emailValidate").val("0");
                            email_error.html(" ");
                            alert("alok");
                            return true;
                        }


                    }
                });

        }

        else{
        email_error.html(" ");
        return true;
        }

    }
});
4

4 に答える 4

1

次のようなものを試してください

$(document).ready(function() {
    // global vars
    var form = $("#signupForm");
    var email = $("#email");
    var email_error = $("#invalid");

    // On blur
    // userEmail.blur(validateEmail);

    // On Submitting
    form.submit(function() {

                validateEmail(function(flag) {
                            if (flag) {
                                alert("submit true");
                                form[0].submit();
                            } else {
                                alert("submit false");
                            }

                        });
                return false;
            });

    function validateEmail(callback) {
        // if it's NOT valid
        alert("In email");
        var a = $("#email").val();
        var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;

        if (email.val() == "") {
            email_error.html("Please enter your email ");
            callback(false);
        }
        // if it's valid email
        else if (filter.test(a) == false) {
            email_error.html("Please enter Valid email address");
            callback(false);
        } else if (filter.test(a) == true) {
            alert("elseif");
            var baseUrl = '<?= base_url() ?>';

            $.ajax({
                        type : "POST",
                        url : baseUrl + "index.php/index/validateUserEmail",
                        data : "useremail=" + $("#email").val(),
                        success : function(msg) {
                            alert(msg);
                            if (msg == "1") {
                                $("#tick_cross").fadeIn("slow")
                                        .html('<img src="' + baseUrl
                                                + 'images/cross.png" />');
                                $("#emailValidate").val("1");
                                email_error
                                        .html("This email-Id already exists!");
                                callback(false);
                            } else {

                                $("#tick_cross").fadeIn("slow")
                                        .html('<img src="' + baseUrl
                                                + 'images/tick.png" />');
                                $("#emailValidate").val("0");
                                email_error.html(" ");
                                alert("alok");
                                callback(true);
                            }

                        }
                    });

        }

        else {
            email_error.html(" ");
            callback(true);
        }

    }
});

デモ:フィドル

またはjQuery.deferredを使用したより良い解決策

$(document).ready(function() {
    // global vars
    var form = $("#signupForm");
    var email = $("#email");
    var email_error = $("#invalid");

    // On blur
    // userEmail.blur(validateEmail);

    // On Submitting
    form.submit(function() {
                validateEmail().done(function() {
                            console.log("submit true");
                            form[0].submit();
                        }).fail(function() {
                            console.log("submit false");
                        });
                return false;
            });

    function validateEmail() {
        var deferred = jQuery.Deferred()

        // if it's NOT valid
        console.log("In email");
        var a = $("#email").val();
        var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;

        if (email.val() == "") {
            email_error.html("Please enter your email ");
            deferred.reject();
        }
        // if it's valid email
        else if (filter.test(a) == false) {
            email_error.html("Please enter Valid email address");
            deferred.reject();
        } else if (filter.test(a) == true) {
            console.log("elseif");
            var baseUrl = '<?= base_url() ?>';

            $.ajax({
                        type : "POST",
                        url : baseUrl + "index.php/index/validateUserEmail",
                        data : "useremail=" + $("#email").val(),
                        success : function(msg) {
                            alert(msg);
                            if (msg == "1") {
                                $("#tick_cross").fadeIn("slow")
                                        .html('<img src="' + baseUrl
                                                + 'images/cross.png" />');
                                $("#emailValidate").val("1");
                                email_error
                                        .html("This email-Id already exists!");
                                deferred.reject();
                            } else {

                                $("#tick_cross").fadeIn("slow")
                                        .html('<img src="' + baseUrl
                                                + 'images/tick.png" />');
                                $("#emailValidate").val("0");
                                email_error.html(" ");
                                console.log("alok");
                                deferred.resolve();
                            }

                        }
                    });

        }

        else {
            email_error.html(" ");
            deferred.resolve();
        }

        return deferred.promise();
    }
});

デモ:フィドル

于 2013-03-20T11:51:58.097 に答える
0

オプション async : false を設定する必要があります

于 2013-03-20T12:00:21.983 に答える
0

応答が完了するまでお待ちいただく必要があると思います。readyState==4

$.ajax({
                    type: "POST",
                    url: baseUrl+"index.php/index/validateUserEmail",
                    data: "useremail="+$("#email").val(),
                    success: function(){

                }).done(function (msg) {

alert(msg);
                    if(msg == "1")
                        {
                            $("#tick_cross").fadeIn("slow").html('<img src="'+baseUrl+'images/cross.png" />');
                            $("#emailValidate").val("1");  
                            email_error.html("This email-Id already exists!");
                            return false;
                        }
                        else
                        {

                            $("#tick_cross").fadeIn("slow").html('<img src="'+baseUrl+'images/tick.png" />');
                            $("#emailValidate").val("0");
                            email_error.html(" ");
                            alert("alok");
                            return true;
                        }


                    }
})
.fail(function() { alert("error";
 return true;
); });
于 2013-03-20T12:23:01.190 に答える
0

問題は、AJAX 呼び出しに時間がかかることですが、if ステートメントですぐに戻る必要がある場合です。false を返すだけで十分かどうかもわかりません。イベントをキャプチャして preventDefault() メソッドを呼び出す必要があると思います...

最善の方法は、 <input type="submit" /> ボタンを <input type="button" id="submitButton" /> に変更してから、form.submit()現在のハンドラーを完全に削除することです。これを追加：

$(function(){
    $('#submitButton').click(validateEmail)

})

次に、関数に追加$("#signupForm").submit()します。validateEmail()

function validateEmail(){
    //if it's NOT valid
    alert("In email");
    var a = $("#email").val();
    var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;

    if(email.val() == ""){
        email_error.html("Please enter your email ");
        return false;
    }
    //if it's valid email
    else if(filter.test(a)==false){
        email_error.html("Please enter Valid email address");
        return false;
    }
    else if(filter.test(a)==true){alert("elseif");
    var baseUrl = '<?= base_url() ?>';

            $.ajax({
                type: "POST",
                url: baseUrl+"index.php/index/validateUserEmail",
                data: "useremail="+$("#email").val(),
                success: function(msg){
                alert(msg);
                if(msg == "1")
                    {
                        $("#tick_cross").fadeIn("slow").html('<img src="'+baseUrl+'images/cross.png" />');
                        $("#emailValidate").val("1");  
                        email_error.html("This email-Id already exists!");
                        return false;
                    }
                    else
                    {

                        $("#tick_cross").fadeIn("slow").html('<img src="'+baseUrl+'images/tick.png" />');
                        $("#emailValidate").val("0");
                        email_error.html(" ");
                        alert("alok");
                        $("#signupForm").submit() // <--- HERE
                        return true;
                    }


                }
            });

    }

    else{
    email_error.html(" ");
    return true;
    }

}

あなたはおそらくもう少しそれをきれいにすることもできます...

于 2013-03-20T11:56:53.810 に答える