checboxをクリックしてtrを展開して閉じるには

Question

私はテーブルに10行あります。各行の最初の列（td）は、新しいtr行を展開するための（+ボタン）です。私は、+ボタンを何度もクリックすることで、任意の行を展開して閉じることができます。しかし、私はまた、一度にすべてのtrを拡大して閉じるための共通のチェックボックスを持っています。これは別々にやっているときにうまくいきます。チェックボックスをクリックするとコード（$（this）.click（））を使用して+ボタンをクリックします。

しかし、問題は+ボタンをクリックして1行を展開したことです。その後、共通のチェックボックスをクリックすると、展開されたすべての行が開きますが、ここではすでに開いている行が閉じられます。私の要件は、+ボタンをクリックして既に開いている行を閉じることはありません。

私がクリックした現在の行（tr）に新しいクラス（ ".shown"）を追加しています。+ボタンのクラス名は ".details-control"です。

以下のコードは、クリック時の一般的なチェックボックスコードです。

$('.common-checkall').on('change', function() { 
    var status = this.checked; 
    $(".details-control:visible").each(function(){ 
     $(this).click(); 
    }); 
}); 

これは

$(elemId+' tbody').on('click', 'td.details-control', function(){ 
    var tr = $(this).closest('tr'); 
    var row = royaltiesTable.row(tr); 
    try { 
     if (row.child.isShown()) { 
      row.child.hide(); 
      tr.removeClass('shown'); 
     } else { 
      row.child(format(row.data(), tr)).show(); 
      tr.addClass('shown'); 
     } 
    } catch(err) { 
     console.log(""); 
    } 
}); 

Answer 1

を展開し、例えば $(this).click(); を呼び出す前にチェックを追加することが+ボタンのコードです

$('.common-checkall').on('change', function() { 
    var status = this.checked; 
    $(".details-control:visible").each(function(){  
     if((status && !$(this).hasClass('shown')) || (!status && $(this).hasClass('shown'))) { 
      $(this).click(); 
     } 
    }); 
});