jquery validateとcustom errorPlacementを使用するときのエラーをクリアする方法

Question

jqueryを使用してフォームの検証に妥当性を確認しています。 の代わりにこのオプションを使用して、私は要素 に境界線を追加してい欠落フィールドに要素を追加するerrorPlacement

$("#signup-form").validate({ 
     submitHandler: function(form) { 
     form.submit(); 
    }, 
    errorPlacement: function(error, element) { 
     element.css("border", "solid 1px red"); 
    }      
}); 

私が把握するように見えることはできません一つのことをするときに有効な、それをクリアする方法ですか？

私は上記のコードから始めました。次に試してみて、私は結果と混同しています。 フィールドが失敗したときにsuccess:オプションがない場合、クラスが正常に追加されます。しかし、私がsuccessオプションを追加するとすぐに、すべての必須フィールドがそのクラスを取得しています。要素を調べると、私は<input class="required invalid valid">と表示されるので、何かを間違って実行しています。

  $("#signup-form").validate({ 
       submitHandler: function(form) { 
        // do other stuff for a valid form 
        //form.submit(); 
       }, 
       errorPlacement: function(error, element) { 
        element.addClass("invalid"); 
       },   
       success: function(error) { 
        // change CSS on your element(s) back to normal 
       },      
       debug:true 
      }); 

Answer 1

あなたは

success: function(error) { 
    // change CSS on your element(s) back to normal 
} 

これは、提出フォームなしで動的に動作するはずです... .validate()オプションのリストにこれを追加してみてください。エラーが解決するとすぐに、含まれているコードが実行されます。

documentationを参照してください。

jsFiddleを使用して問題のデモを作成してください。ここにはa blank jsFiddleと.validate()が含まれており、すぐに使用できます。

---

EDITOP's jsFiddleあたりとして

、私が作ったこれらの変更...

errorPlacement: function(error, element) { 
     $(element).filter(':not(.valid)').addClass("invalid"); 
    }, 
    success: function(error) { 
     console.log(error); 
     $("#signup-form").find('.valid').removeClass("invalid"); 
    } 

ワーキングデモ：http://jsfiddle.net/u3Td3/6/

サイドノート：もあなたいくつかのHTMLを持っていたues。あなたは、でinput要素を「自己終了」する必要があります。送信ボタンの場合と同じこと、</input>を使用するのではなく、自己閉じます。 HTMLを検証するには、validator.w3.orgを参照してください。また、レイアウトにはtableを使用せず、CSSを使用します。