2

ユーザーが複数の選択ボックスを追加できる動的フォームがあります。

<form id="ticket_form">
  <select class="required" name="quantity[1]"></select>
  <select class="required" name="quantity[2]"></select>
  <select class="required" name="quantity[3]"></select>
</form>

現時点では、ユーザーが各選択ボックスの値を選択したことを確認しています。

$("#ticket_form").validate({
  rules: {
    'quantity[]': 'required'
  },
  messages: {
    'quantity[]': 'This field is whack'
  }
});

選択した値を持つには、実際にはそのうちの1つだけが必要です。少なくとも 1 つの選択ボックスに値がある場合、検証をパスするにはどうすればよいですか?

アップデート

これは、Ben Barden のソリューションに従って問題を解決するために最終的に使用したコードです。

$.validator.addMethod("groupSelect", (function(value, element, isRunning) {
  return $(".required[value!=\"\"]").length > 0;
}), "At least one must be selected.");

また、クラスに追加のクラス ルールを追加したrequiredので、実際の検証ルールにこれ以上追加する必要はありません。

$.validator.addClassRules({
  'required': {
    'groupSelect': true
  }
});
4

3 に答える 3

2

このためには、独自の検証ルールを作成する必要がありますが、必要なルールは非常に単純です。そのクラスのすべてのメンバーは、デフォルト以外の値を持つそのクラスのメンバーが存在するかどうかを検証します。したがって、クラスセレクターを使用してから、値が等しくないセレクターでさらにフィルタリングし、結果に何かが含まれているかどうかを確認します。

    jQuery.validator.addMethod(
    "groupSelect",
    function (value, element, isRunning)
    {
        return $('.groupSelectClass[value!="defaultSelectValue"]').length > 0;
    },
    "At least one must be selected.");

次に、groupSelectルール（そこに書かれているもの）をgroupSelectClassクラスに適用し（生成時にすべてのセレクターに追加されることを確認します）、代わりにあるものdefaultSelectValueが実際にセレクターのデフォルト値であることを確認します。これはすべてvalidate、後でではなく、ベース コールの前に設定する必要があることに注意してください。

編集：

groupSelect詳細な説明: 上記のコード ブロックは、名前(またはそこに入力したもの)で検証ルールを定義します。記述されてgroupSelectいるように、クラス「groupSelectClass」を持つノードの少なくとも 1 つに「defaultSelectValue」以外の値がある場合にのみ、ルールは有効を返します。クラス「groupSelectClass」のすべてが「defaultSelectValue」のデフォルト値を持つ選択ボックスであることを確認した場合、これらの選択ボックスの少なくとも 1 つが設定されている場合にのみ、このルールは有効を返します。次に、関数を使用してこのルールを「groupSelect」クラスに適用するjQuery.validator.addClassRulesと、それらのすべての選択ボックスが検証要件としてそれを持ち、「少なくとも 1 つを選択する必要があります」と表示されます。検証失敗時。 http://docs.jquery.com/Plugins/Validation/Validator/addClassRulesでは、addClassRules 関数の使用方法を十分に理解できます。実際、このサイトで多くのことを行う場合は、そのサイトの一般的な内容、特に検証プラグインの情報を読むことをお勧めします。

于 2012-12-05T13:57:21.917 に答える
0

これをチェックする関数がありますが、これは .validate() アプローチではありません

function CheckValue(){
    var oneSelected = false;


     $('#ticket_form select').each(function(k,v){

          // this assumes that zero is an unselected index 
          if($(v).children('option:selected').val() != 0){

             oneSelected = true;

           }

     });

     return oneSelected;
}
于 2012-12-05T13:56:29.913 に答える
0 
var index = [];

$('.required').each(function(i) {
    if ($(this).val() != null) { // Check for null or undefined if not proceed
        index.push(i);
    }
});

index には、値を持つ選択ボックスのインデックスの配列が含まれるようになりました。を使用してそれらにアクセスしますindex[0]。ここで、0 は値を持つ最初に一致した選択です。

var selectVal = $('.required').eq(index[0]).val();
于 2012-12-05T14:03:14.453 に答える