0

チェックCheckAllボックスをオンにすると、ページ上のすべてのチェックボックスがオンになり、チェックボックスのそれぞれのテーブルである親が別の div に移動します。チェックボックスのCheckAllチェックを外すと、ページ上のチェックされたすべてのチェックボックスのチェックを外し、コピーされたテーブル要素をdivから削除する必要があります。

/*******************Check and Uncheck all the checkboxes on the page***********************************/
$("#dvReports #checkAll").click(function () 
{
    var pageNum = $("#dtlRptPrvNxtLnk .selected.link_look").html();
    alert(pageNum);
    if ($("#dvReports #checkAll").is(':checked')) 
    {
        $("#dvReports input[type=checkbox]").each(function () 
        {
            $(this).prop("checked", true);
            // If a listing is selected then move it to  divPrintContainer, 
            // which is buried inside _reportLayout.cshtml
            $(this).closest('table')
                .toggleClass(pageNum)
                .clone()
                .appendTo("#divPrintContainer");
        });
    } 
    else 
    {
        $("#dvReports input[type=checkbox]").each(function () 
        {
            $(this).prop("checked", false);
        });

        $("#divPrintContainer").children('table.'+ pageNum ).remove();
    }
});

次の問題が発生しています。

  1. CheckAllチェックボックスを偶数回クリックするたびに、機能し.toggleClass(pageNum) ません。つまり、初めてCheckall .toggleClass(pageNum)をチェックすると、クラス名が割り当てられます。のチェックを外しますCheckall。もう一度チェックオールをチェックすると、ページ番号がクラスとして割り当てられません（ただし、ページ番号でアラートが表示されます）。

フィドルの HTML

4

2 に答える 2

1

あなたtoggleClassはif ($("#dvReports #checkAll").is(':checked')) {

その結果、toggleClassはチェック時にのみ呼び出され、チェック解除時には呼び出されません。したがって、1 をクリックtoggleClassして、クラスを追加します。2 をクリックすると、チェックボックスがオフになり、クラスは変更されません。3 をクリックすると、チェックボックスがオンtoggleClassになり、2 回目だけ呼び出され、クラスが削除されます。

あなたが望むのは、チェックされたときだけでなく、クリックされるたびに呼び出すことだと思います。から取り外しifます。

于 2013-07-22T19:07:14.750 に答える
1

あなたの質問を正しく理解できれば、問題は次の行にあるようです。

$(this).closest('table').toggleClass(pageNum).clone().appendTo("#divPrintContainer");

この行の私の解釈は次のとおりです。

  1. DOM ツリーを上方向に検索して、チェックボックスを含むテーブルへの参照を取得します。
  2. pageNum というクラスを切り替えます。つまり、最初に追加し、2 回目に削除するなどです。
  3. テーブルを新しい DOM 要素にコピーする
  4. 新しい要素をコンテナに追加します

したがって、[すべてチェック] をクリックすると、各テキスト ボックスに最も近いテーブルのクラスが切り替えられますが、これがオフになることはありません。2 回目に選択すると、クラスが削除され、コンテナにコピーされます。

単純に、行を次のように変更します。

$(this).closest('table').clone().addClass(pageNum).appendTo("#divPrintContainer");
于 2013-07-22T19:07:42.367 に答える