jQueryはグループ3のテキスト入力を1つに検証しますか？

Question

私は電話番号の3つのテキスト入力持っている - phone_ac、phone_ex、phone_nm - すなわち999 555 1212

私が個別に検証し、3つのエラーメッセージを与えるためにjqueryのを使用することができた：

"Phone number (area code) is required." 
"Phone number (exchange) is required." 
"Phone number (last 4 digits) is required." 

があります3つのフィールドのいずれかが空白の場合にのみ1つのエラーメッセージを表示する方法？

Answer 1

これまで、PhoneNumberという名前の隠し入力を追加し、requiredおよびregex検証フラグを追加することで、同様の状況を処理しました。フォームを検証する前に、その値を3つすべてのフィールドの連結に設定します。

Answer 2

一般的なエラーメッセージとerrorLabelContainerオプションを含む要素でerrorContainerオプションを設定し、errorLabelContainerを不可視コンテナエレメントでラップします。

<style type="text/css"> 
     #errorMessage 
     { 
      display: none; 
     } 
    </style> 

    <div style="display: none;"> 
     <div id="errorLabels" > 
     </div> 
    </div> 
    <input type="text" id="phone_ac" class="required" /> 
    <br /> 
    <input type="text" id="phone_ex" class="required" /> 
    <br /> 
    <input type="text" id="phone_nm" class="required" /> 
    <div id="errorMessage"> 
     All phone fields are required!</div> 
    <hr /> 
    <input class="submit" type="submit" value="Submit" /> 

Answer 3

はこれを行い 'グループ' と呼ばれるjQueryの検証の設定があり、この

<script type="text/javascript"> 
     $(document).ready(function() { 

      $('#stay-in-touch').validate({ 

       highlight: function (element, errorClass) { 
        $('#span1').text("Please enter all the values"); 
       }, 
       rules: { 
        text1: "required", 
        text2: "required", 
        text3: "required" 
       }, 
       messages: { 
        text1: "", 
        text2: "", 
        text3: "" 
       } 
      }); 
     }); 


    </script> 


    <form method="post" action="Default2.aspx" id="stay-in-touch" > 
    <div> 
     <input type="text" id="text1" name="text1" /> <br />    
     <input type="text" id="text2" name="text2" /> <span id="span1"></span> <br />    
     <input type="text" id="text3" name="text3" /> <br /> 

     <input type="submit" value="submit" />   

    </div> 
    </form> 

Answer 4

のようにしてみてください。あなたが持っているので、もしあなたは自分のIDのことで、あなたの検証とグループ化に含めることができます：あなたにグループを追加する

<div> 
    <input type="text" id="phone_ac" name="phone_ac" />    
    <input type="text" id="phone_ex" name="phone_ex" />    
    <input type="text" id="phone_nm" name="phone_nm" /> 
</div> 

てみ検証：

$('#yourform').validate({ 
//...Your existing validation logic... 
groups: { 
    phoneNumbers: "phone_ac phone_ex phone_nm" 
} 
});