DataTables выбирает и реагирует на дочерние строки. Как свернуть дочерние строки?

Question

Если я использую DataTable «s как responsive и select расширение я получаю запутанное поведение:

1. Нажмите на строку, и она будет выделен и расширена, чтобы показать дочерние строки. ОК.
2. Нажмите еще одну строку, чтобы этот выбор был выбран и расширен. Все еще хорошо.
3. Нажмите первую строку снова, и она станет выбранной, но рухнула. НЕ В ПОРЯДКЕ.

Как заставить строки вести себя аналогично аккордеонам jQuery UI? Смысл, свернуть все дети невыделенного ряда после того, как я сделаю новый выбор?

jsfiddle: https://jsfiddle.net/pm2gk9we/12/

Answer 1

Это то, что я придумал - я прячу дочерние строки после строки нажмите:

$("tr").unbind("click").click(function() { 
$("#table").DataTable().rows().every(function() { 
    this.child((this.data())).hide();   
}); 
}); 

Он отлично работает, когда я инициализировать responsive, как это (скрыть значок на панели слева и расширить ряд на каждой клетке:

new $.fn.dataTable.Responsive(table, { 
         details: { 
          type: 'column', 
          target: 'tr' 
         } 
        }); 

Решение скрипку: https://jsfiddle.net/pm2gk9we/13/