2016-07-25 9 views
0

https://jqueryvalidation.org/を使用してフロントエンドで自分のフォームを検証しています。基本的な "if field is empty - validate"は正常に動作します。jquery.validate - 有効なメールまでボタンが無効にされています

しかし、有効なメールアドレスが入力されるまで、送信ボタンを最初に無効にしたいと思います。フィールドが有効になるとすぐにボタンを有効にしたいと思います(キーを押すと)。

基本的には、有効な「btn-disabled」クラスを削除するだけで済みます。

私はこの関数/メソッドを追加するためにjQueryに苦労しています。誰かを助けることができれば感謝します。

相続人はわずか簡体版:http://codepen.io/dagford/pen/kXJpEZ

$(document).ready(function(){ 

    $("#reset-form").validate({ 
     rules: { 
      emailaddress: { 
       required: true, 
       email: true 
      } 

     }, 
     messages: { 
      email: "Please enter a valid email address" 
     } 

    }); 

}); 
+0

可能な重複:http://stackoverflow.com/a/13031687/6188402 –

答えて

0

ためのattrを持っています。デフォルトではボタンは無効にしておき、フォームを検証したら無効な属性を削除します。

$("#emailaddress").on("blur", function(){ 
    if($("#reset-form").valid()) 
    { 
     $("#btn-reset").removeAttr("disabled"); 
    } 
}); 

コードペン:http://codepen.io/anon/pen/YWLjKX?editors=1010

+1

乾杯。私はあなたの「ぼかし」を「キー押し」に変えました。それは私が欲しいものです。 – swisstony

0

フォームは、電子メールアドレスを入力した後に有効であるかどうかをチェックすることができます。この

$('#button1, #button2').attr("disabled", true); 
+0

こんにちはカルロス私はと本当に心配していませんよこの時点では無効な属性です(ただし後で追加する予定です)。私が知りたいのは、有効な電子メールが入力されるとすぐに、リンクされた検証プラグインを使用して、「何か」(つまり、クラスの追加/削除など)を行うことです。 そして 'すぐに' - ある種のキー押しイベントを意味する – swisstony

0

チェックこの:

<script type="text/javascript"> 
       (function() { 
         $('form > input').keyup(function() { 
          var empty = false; 
          $('form > input').each(function() { 
           if ($(this).val() == '') { // write your code for valid email here 
            empty = true; 
           } 
          }); 
          if (empty) { 
           $('#register').attr('disabled', 'disabled'); 
          } else { 
           $('#register').removeAttr('disabled'); 
          } 
         }); 
        })() 
       </script> 
関連する問題