0

私のサイトはhttp://www.extrabux.com/users/loginです

ユーザーがログインすると、Jquery Validate プラグインは「リモート」機能を使用して、提供された電子メール アドレスがユーザーとしてデータベースに存在するかどうかを確認します。接続とサーバーが高速である場合、ユーザーはパスワードの入力を完了する前にフィードバックを確認します。

email: { 
    required: true, 
    email: true, 
    remote: {//http://docs.jquery.com/Plugins/Validation/Methods/remote
        url: 'check-signin-email-address',
            type: "post",
            data: {
                emailAddress: function() {
                    return $("#email").val();
                }
            }
        }
}

ただし、接続またはサーバーが遅い場合、フォームが送信される前に望ましくない遅延が発生します (フォームが有効であることが確認されるまで Jquery Validate プラグインが待機するため)。

私が欲しいのは：

  • ユーザーがフォームを送信する前にリモート クエリが終了した場合は、送信をブロックする必要があります (電子メール アドレスがデータベースにないことが判明した場合)。
  • リモート クエリが完了する前にユーザーがフォームを送信した場合、リモート クエリの検証ルールは無視されます (遅延が発生しないように、サーバー側の検証でユーザーが存在しないことが検出されます)。

考え？

4

2 に答える 2

0 
 function checkEmail(){  
   $("#email").removeClass('email'); // this stops validation during ajax
   //might want to add a loading image to let user know 
     $.ajax({
       type: //type
       url: //url to check email,
       data: //email to check,
       success: function (msg) {
           $("#email").addClass('email'); //turns validation back on
               //take away loading image

            if (msg.GoodEmail != "GoodEmail" ) { //however you check for existing email
              $("#email").addClass('error'); //forces failed validation
               }
         }
      });
 }

これはjqueryのajaxを使用した例です。これにより、ajaxの前に、成功した場合、エラーが発生した場合に、この方法でもう少し制御してイベントを処理できます。

于 2012-11-27T18:59:57.310 に答える
0

私はこれを理解したと思います。「リモート」オプションを使用する代わりに、addMethod を使用して、「isExtrabuxMember」と呼ばれるルールを作成しました。また、いくつかのグローバル変数を作成し、#email フィールドの変更にバインドされた ajax を使用して、提供された電子メール アドレスが既存の Extrabux メンバーに属しているかどうかを確認しました。

これが役に立った場合、またはより良いアイデアがある場合は、コメントしてください。

「検証」プラグイン呼び出しの上にこれがあります：

jQuery.validator.addMethod("isExtrabuxMember", function(value, element) {
    var emailRemoteFuncResult = checkSigninEmailAddressResult === null ? true : checkSigninEmailAddressResult;
    return emailRemoteFuncResult;
});

var checkSigninEmailAddressResult = null;
var emailXhrCheck;
$('#email').bind('change keyup', function(){
    checkSigninEmailAddressResult = null;
    if(emailXhrCheck){
        emailXhrCheck.abort();
    }
    emailXhrCheck = $.ajax({
        url: '/users/check-signin-email-address',
        type: "post",
        async: true,
        data: {
            emailAddress: function() {
                return $("#email").val();
            }
        },
        success: function(data){
            checkSigninEmailAddressResult = data;
            $("#email").valid();
        }
    });
});
$('#loginForm').submit(function(){
    if(emailXhrCheck){
        emailXhrCheck.abort();
    }
});

次に、「検証」プラグイン呼び出し内で:

rules: {              
    email: { 
        required: true, 
        email: true, 
        isExtrabuxMember: true                     
    }, 
    password: { 
        required: true, 
        minlength: 4 
    }      
}, 
messages: {
    email: {
        isExtrabuxMember: function(){
            var currentEmail = $('#email').val();
            return $.validator.format('<b>{0}<\/b> does not yet have an Extrabux account. <a href="\/users\/register?emailAddress={0}">Sign up?<\/a>', currentEmail);
        }
    },
    password: { 
        required: "Oops, you forgot to enter your password!"
    }                    
}
于 2012-11-27T21:46:57.150 に答える