2016-12-20 20 views
-1

私のフォームにjQueryの検証を使用しています。アラートJqueryでのプロンプトの確認

何も入力せずに送信すると、エラーメッセージが統合され、単一のアラートプロンプトで表示されます。

問題は統合アラートの後であり、最初のフィールドアラートが表示され続け、ユーザーにとっては間違いなく迷惑です。これを避ける手助けができますか?

jQuery(".ContactForm").validate({ 
     ignore: ":hidden", 
     rules: { 
      Location: { 
       required: true 
      }, 
      Program: { 
       required: true 
      }, 
      firstname: { 
       required: true, 
      }, 
      lastname: { 
       required: true, 
      }, 
      zip: { 
       required: true, 
       checkZipsValue: true, 
       minlength: 5 
      }, 
      dayphone: { 
       required: true, 
       phoneUS: true, 
       checkPhoneValue: true 
      }, 
      email: { 
       required: true, 
       email: true, 
       validEmail:true 
      } 
     }, 
     messages: { 
      Location: "Please select a location.", 
      Program: "Please select a program.", 
      firstname: "Please enter your first name.", 
      lastname: "Please enter your last name.", 
      dayphone: "Please enter a valid phone number.", 
      zip: "Please enter a valid Zip code.", 
      email: "Please enter a valid email.", 
     }, 
     errorPlacement: function (error, element) { 
      //alert(error.text()); 

     }, 
     showErrors: function(errorMap, errorList) { 
     var error = ''; jQuery.each(errorList,function(i, a){error += a.message + "\n";}); if(error.length > 0){window.alert(error);} 
    }, 
}); 
+0

事は、uは、この検証機能の外のエラー変数を宣言し、その内のすべての文字列をマージして、すべてのフィールドの後だけに、警告を表示し、検証していることを優れているので、showErrosは、すべてのフィールドの毎回の呼び出しでありますすべてのエラー。 –

+0

ブラウザコンソールのエラーは何ですか? –

+0

コンソールにエラーはありません。 –

答えて

0

コード以下

は親切にそのchekphonevalue、validemail、checkzipsvalueに注意し、1つのアラートでは、すべてのメッセージを表示することです、あなたの追加メソッドですそれはjqueryのバリデータのプラグインとの心配がないので、それを追加することを忘れていけませんバリデーターで。

<form id="myform" action="#"> 

    <input type="text" name="Location"> 
    <input type="text" name="Program"> 
    <input type="text" name="firstname"> 
    <input type="text" name="lastname"> 
    <input type="text" name="zip"> 
    <input type="text" name="dayphone"> 
    <input type="text" name="email"> 

    <input type="submit" value="email"> 
</form> 
<script type="text/javascript"> 
var errors; 
jQuery("#myform").validate({ 
    onfocusout: false, 
    onkeyup: false, 
    onclick: false, 
    ignore: ":hidden", 
    rules: { 
     Location: { 
      required: true 
     }, 
     Program: { 
      required: true 
     }, 
     firstname: { 
      required: true, 
     }, 
     lastname: { 
      required: true, 
     }, 
     zip: { 
      required: true, 
      checkZipsValue: true, 
      minlength: 5 
     }, 
     dayphone: { 
      required: true, 
      phoneUS: true, 
      checkPhoneValue: true 
     }, 
     email: { 
      required: true, 
      email: true, 
     } 
    }, 
    messages: { 
     Location: "Please select a location.", 
     Program: "Please select a program.", 
     firstname: "Please enter your first name.", 
     lastname: "Please enter your last name.", 
     dayphone: "Please enter a valid phone number.", 
     zip: "Please enter a valid Zip code.", 
     email: "Please enter a valid email.", 
    }, 
    showErrors: function(errorMap, errorList) { 
     errors=""; 
     jQuery.each(errorList,function(key,item){ 
      errors+=item.message+"\n"; 
     }); 
     alert(errors); 
    }, 
}); 
</script> 
関連する問題