0

最初にすべてのチェックボックスをロードするチェックボックスのセットが複数あるフォームがあります。フォームが送信されると、どのチェックボックスが「チェック」されているかに基づいて、配列が $_POST に組み込まれます。フォーム全体は、データベース データに基づいて PHP を介して動的に構築されます。

私が達成しようとしているもの:グループ内のすべてのチェックボックスをすべて「チェックされていない」ように切り替えるボタンまたは「クリック可能なもの」が必要です。または、これは 2 つのボタンで実現できます。(どちらかきれい/簡単です)

例: (ここでは、チェックボックス配列の単純な 2 つのグループのみを示します) (それぞれを個別に切り替える必要があります) (以下のコードを手動でラップして、すべてを下のボックスに表示します) (この例は、 PHP コード ビルド) (例では 2 つのボタンが示されていますが、これはおそらく 1 つの「すべてを切り替える」ボタンが最適です)

<form action="" method="post" enctype="multipart/form-data" name="filters">

Select: <input name="select_all_regions" onclick="toggle_all_regions()" 
          type="button" value="all" /> 
/ <input name="select_no_regions" onclick="toggle_no_regions()" 
          type="button" value="none" />
<input name="regions[]" type="checkbox" value="7" checked />East Coast
<input name="regions[]" type="checkbox" value="14" checked />West Coast
<input name="regions[]" type="checkbox" value="15" checked />Gulf Coast

Select: <input name="select_all_places" onclick="toggle_all_places()" 
          type="button" value="all" /> 
/ <input name="select_no_places" onclick="toggle_no_places()" 
          type="button" value="none" />
<input name="places[]" type="checkbox" value="25" checked />Dock
<input name="places[]" type="checkbox" value="29" checked />Ramp
<input name="places[]" type="checkbox" value="34" checked />Natural

<input class="filter-button" id="filter-submit-button" name="go" 
          type="submit" value="Go!" />

</form>

私は試しました:JavascriptとjQueryですが、「[]」は両方をスローするようです。簡単な解決策があると確信していますが、これまでのところ見つけることができませんでした。

ご覧いただきありがとうございます!!!


更新(これまで):

私は何か間違ったことをしているようです (うまくいきません)、それは明らかですか?

これまでに試したコード:

   <SCRIPT LANGUAGE="JavaScript"> 
    <!-- Begin 
    var $regions = $('input[name="regions[]"]');
    $('[name="select_all_regions"]').click(function(){
    $regions.prop('checked', !regions.first().is(':checked'));
    });
    // End --> 
    </script>

Select: <input name="select_all_regions" type="button" value="toggle all regions" /><br />

<input class="category-item-checkbox" name="regions[]" type="checkbox" value="7" checked /><span class="category-item-title">Uptown</span>
<input class="category-item-checkbox" name="regions[]" type="checkbox" value="14" checked /><span class="category-item-title">Warehouse District</span>
<input class="category-item-checkbox" name="regions[]" type="checkbox" value="15" checked /><span class="category-item-title">French Quarter</span>

解決済み: (デポによる) 以下を参照してください。

他のソリューションも機能する可能性があると確信していますが、現時点ではそれらを機能させることができませんでした.

これを見てくれてありがとう!StackOverflow コミュニティ ROCKS!!!

4

3 に答える 3

1

次のことを試してください。

var $places = $('input[name="places[]"]');
$('[name="select_all_places"]').click(function(){
  $places.prop('checked', !places.first().is(':checked'));
});
于 2012-12-28T19:38:59.613 に答える
1

イベントのない正確な HTML をonclick使用すると、次を使用できます。

$('form[name="filters"]').click(function (e) {
    var match = e.target.name.match(/select_(all|no)_(.*)/);
    if (match) {
        $('input[name="' + match[2] + '[]"]').attr('checked', 'all' === match[1] && 'checked');
    }
});

デモ

またはもっと簡単に:

var $regions = $('input[name="regions[]"]'),
    $places = $('input[name="places[]"]');

$('input[name="select_all_regions"]').click(function() {
    $regions.attr('checked', 'checked');
});

$('input[name="select_no_regions"]').click(function() {
    $regions.attr('checked', false);
});

$('input[name="select_all_places"]').click(function() {
    $places.attr('checked', 'checked');
});

$('input[name="select_no_places"]').click(function() {
    $places.attr('checked', false);
});

<強い>デモ

于 2012-12-28T19:44:03.707 に答える
0

インラインの onclick 関数を削除して、すべてのボタンに対して 1 つのクリック イベントを設定できます。

$('form[name=filters] input[type=button]').click(function() {
    var name = $(this).attr('name').split('_')[2];  // takes regions/places out of name 
    $('input[name="'+ name +'[]"]').prop('checked',$(this).val() == 'all');
});​

http://jsfiddle.net/wirey00/KJUFU/

于 2012-12-28T19:47:32.313 に答える