0

jQuery の検証に問題があり、いくつかの提案を使用できます。

このフォームの 3 つの電話番号フィールドを検証して、グループのエラー メッセージを 1 つだけ表示する方法はありますか? どんな助けでも大歓迎です。

形

<form id="mForm" name="form">
<div class="field right">
  <label class="labelStd" id="phoneNumber">Phone Number*</label>
  <input name="txtPhone1" type="text" maxlength="3" id="txtPhone1" class="small-phone" name="txtPhone1" Onchange="Tab(this, 'txtPhone2');" />
  <input name="txtPhone2" type="text" maxlength="3" id="txtPhone2" class="small-phone" name="txtPhone2" Onchange="Tab(this, 'txtPhone3');" />
  <input name="txtPhone3" type="text" maxlength="4" id="txtPhone3" class="small-phone" name="txtPhone3" />
</div>

<button type="submit" id="btn_submit" class="button-black right">SEND</button>
</form>

スクリプト (jquery 検証あり)

<script type="text/javascript">
$("#mForm").validate({

onfocusout:false,
focuseInvalid:false,
onkeyup:false,

rules: {

    txtPhone1:{
            required: true,
            digits: true,
            minlength: 3,
            maxlength: 3
        },
    txtPhone2:{
            required: true,
            digits: true,
            minlength: 3,
            maxlength: 3
        },
    txtPhone3:{
            required: true,
            digits: true,
            minlength: 4,
            maxlength: 4
        }
    },

messages: {

    txtPhone1: "Your phone number is required.",
    txtPhone2: "Your phone number is required.",
    txtPhone3: "Your phone number is required."
}


  });

  $("#mForm").submit(function(){

if($(this).valid()){

form.submit();

}

else{ }

 });
</script>
4

1 に答える 1

1

groupsオプションを使用する必要があります...

エラー メッセージのグループ化を指定します。グループは、キーとしての任意のグループ名と、値としての要素名のスペースで区切られたリストで構成されます。グループ メッセージの配置場所を制御するには、errorPlacement を使用します。

groups:  {
    someArbitraryName: "txtPhone1 txtPhone2 txtPhone3"
}

一般的なデモ: http://jsfiddle.net/3RFsa/

補足:

ハンドラーについてsubmit...

$("#mForm").submit(function(){
    if($(this).valid()){
        form.submit();
    }
...

それは完全に余分で不必要なので、完全に削除します。デフォルトでは、プラグインは有効な場合にのみフォームを自動的に送信します。に加えて別のことをしたい場合はsubmit()、プラグインのsubmitHandlerコールバック関数を使用できます。フォームが検証に失敗したときに何かをする必要がある場合は、プラグインのinvalidHandlerコールバック関数を使用してください。

于 2013-07-11T16:33:51.780 に答える