2

現在、私は2つのテーブルを持っています

左上のチェックボックスにすべて選択機能がありますが、1 つのすべて選択をクリックすると、両方のテーブルのすべてのチェックボックスが強調表示されますが、クリックした特定の「すべてチェック」ですべてのボックスのみを選択したいのです。

また、すべてを選択して方向ボタン < または > のいずれかをクリックすると、すべての行がうまくドラッグされますが、ここに示すようにヘッダーが一緒にドラッグされます。

私のJQueryは現時点では非常に単純ですが、明らかに何かを見逃しています-

 $('#select-all').click(function (event) {
        if (this.checked) {
            // Iterate each checkbox
            $(':checkbox').each(function () {
                this.checked = true;
            });
        }
        else
        // Iterate each checkbox
            $(':checkbox').each(function () {
                this.checked = false;
            });
    });

「select-all」は、「tarifs de quittancement」の「すべて選択」チェックボックスの ID です。

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

編集

>ボタンコードの私のJQueryは次のとおりです：

   $("#move-to-1").on("click", function () {
        var selected = $("#table2").find("input:checked");

        selected.each(function (idx, elem) {
            $(elem).closest("tr").detach().appendTo($("#table1 tbody"));
        });
    });

これは、あるテーブルから別のテーブルにすべてを移動するのにうまく機能しますが、すべて選択チェックボックス/テーブルヘッダーを含む行を残りの行データと一緒に移動させたくありません。これはどのように行うことができますか？

再度、感謝します。

さらに編集

1 つのチェックボックス行を選択して (すべて選択ではない)、それを < または > 移動するとすべての行が移動するという小さなバグを除いて、すべてが並べ替えられました。

使用中の JQuery:

   $('#move-to-1').on('click', function () {
        var selected = $('#table2').find('input:checked');
        selected.each(function (idx, elem) {
            $(elem).closest('tbody').find('tr').detach().appendTo($("#table1 tbody"));
            $('input[type=checkbox]').attr('checked', false);
        });
    });   

   $('#select-all').click(function (event) {
    $(this).closest('table').find(':checkbox').prop('checked', this.checked);
    });
4

3 に答える 3

3

現在のテーブル内のチェックボックスを変更するだけです。マークアップを表示していないため、適切なセレクターがどのように見えるか、またはテーブルを使用しているかどうかを推測するのは非常に困難ですが、次のようにしてみてください。

$('#select-all').click(function (event) {
    $(this).closest('table').find(':checkbox').prop('checked', this.checked);
});

アップデート：

<thead>2 番目の質問に対処するには、正しい方法であるandセクションを使用して、これらのテーブル内の本文からヘッダーを分離したと仮定すると<tbody>、セレクターを調整できます。

$('#move-to-1').on('click', function () {
    var selected = $('#table2 tbody').find('input:checked');
    selected.each(function (idx, elem) {
        $(elem).closest('tr').detach().appendTo($("#table1 tbody"));
    });
});
于 2012-09-12T10:19:37.850 に答える
1 
$('#select-all').click(function (event) {

        // mention the table

        var table = $('selector_to_your_table');

        if (this.checked) {
            // Iterate each checkbox
            table.find(':checkbox').each(function () {
                this.checked = true;
            });
        }
        else
        // Iterate each checkbox
            table.find(':checkbox').each(function () {
                this.checked = false;
            });
    });

ノート

jQuery の最新バージョンで:checkboxは非推奨です。こちらをご覧ください。.

:checkbox 使用する代わりにinput[type=checkbox]。

于 2012-09-12T10:19:18.840 に答える
0

それ以外の：

$(':checkbox').each(function () {
  this.checked = true;
});

行う：

$('some_sort_of_selector :checkbox').attr('checked', true);

そのループは必要ありませんeach()- jQuery が自動的に行います。どのチェックボックスが変更されるかを制限するには、ある種のセレクターが必要です。

私はあなたが持っていることに気づきました#select-all- それでも、あなたは2つのすべて選択チェックボックスがあると言います. そんなことはできません。ID は一意である必要があります。

于 2012-09-12T10:20:19.610 に答える