5

しばらくの間答えを探していて、うまくいかないという問題があります。

チェックボックスのグループの少なくとも 1 つのチェックボックスがチェックされているかどうかを確認する方法を探しています。私にとって非常に難しいのは、これらの入力のすべてが異なる名前の値を持っていることです。jQuery検証プラグインなどの回答のみが見つかりました。これが私のhtmlです：

<tr class="formField-checkbox formFieldRequired">
  <td class="formLabelHolder"><label for="field129">Group of checkboxes</label></td>
  <td class="formFieldHolder">
    <input type="checkbox" name="field129[0]" class="formCheckbox required" value="Something1"> 
    <label><span class="formCheckboxLabel">Something1</span></label>
    <input type="checkbox" name="field129[1]" class="formCheckbox required" value="Something2"> 
    <label><span class="formCheckboxLabel">Something2</span></label>
    <input type="checkbox" name="field129[2]" class="formCheckbox required" value="Something3"> 
    <label><span class="formCheckboxLabel">Something3</span></label>
  </td>
</tr>

これが私が今持っている私のjQueryです：

// Validate all checkboxes
var named = [];
var $requiredCheck = $(this).find('input[type="checkbox"].required');

$($requiredCheck,$formId).each(function() {
  // Creates an array with the names of all the different checkbox group.
  named[$(this).attr('name')] = true;
});

// Goes through all the names and make sure there's at least one checked.
for (name in named) {
  var $checkboxes = $("input[name='" + name + "']");
  if ($checkboxes.filter(':checked').length == 0) {
    $checkboxes.closest('.formFieldHolder').addClass('error').append('<span   class="error">Required!</span>');
  } 
}

チェックボックスの名前の値が異なるため、これは現時点では明らかに完全には機能しません。現在、append は、チェックボックスと同じ数のエラー メッセージを出力します。たとえば、5 つのチェックボックスがあり、1 つがオンになっている場合でも、エラー メッセージが 4 回表示されます。私はこれを長い間自分で解決しようとしましたが、うまくいきません。これらのチェックボックスの名前の値を変更したり、html に対して何かを行うことはできません。これができると思った 1 つの方法は、名前の最後の [0]、[1]、[2] の部分を削除することですが、それを機能させる方法が見つかりませんでした。

単一のフォームに 1 つだけではなく、複数のチェックボックス グループが存在する可能性があるため、単純な jQuery 検証メソッドは失敗すると思います。チェックボックスの次のグループは、name="field130[0]"、name="field130[1]"、および name="field130[2]" の name 値を持ちます。うまくいけば、あなたは私の主張を理解していると思います。

どんな助けでも大歓迎です。

編集：

1つのフォームに複数のチェックボックスのグループが存在する可能性があるという説明を追加しました

4

1 に答える 1

11

あなたはこの方法を複雑にしすぎています:)

if ($('.required:checked').length > 0) {  // the "> 0" part is unnecessary, actually
    [do something]
}

:checked の公式 jQuery API ページの最初の例を参照してください。

あなたのコメントに応えて

ページに複数のフォームがある場合は、フォームをコンテナーとして指定できます。

if ($('#form1_id').find('.required:checked').length) {...

複数のフォームをテストするには

各フォームにクラスを指定しtestable_formます。

$('.testable_form').each(function() {
    if ($(this).find('.required:checked').length) {
        [do something - set a flag, add a class...]
    }
});
于 2013-02-03T03:11:10.857 に答える