Отображаемые данные DataTable показывают определенные столбцы

Я использую DataTables наряду с отзывчивыми и сталкивающимися с проблемами при попытке отобразить только определенные столбцы.

Макет таблицы выглядит следующим образом: введите описание изображения здесь

Мне нужно отобразить только 'Column 1', 'Column3', 'Column 7', 'Column 8', 'Column 10' и скрыть другие (они должны отображаться с помощью управления расширением в конце каждой строки).

JS:

  $( 'table' ).DataTable( { order: [ [ 0, "asc" ] ], responsive: { details: { type: 'column', target: 'tr' } }, columnDefs: [ { className: 'control', orderable: false, targets: -1 } ] } ); 

Это JSFiddle . Какие-либо предложения!

Чтобы отобразить определенные столбцы в гибких данных, вам просто нужно добавить Class Controls в таблицу, как показано ниже:

 
Column 1 Column 2 Column 3 Column 4 Column 5 Column 6 Column 7 Column 8 Column 9 Column 10 Column 11

class “all”: всегда показывать столбец независимо от размера экрана.

class “none”: не отображается в виде столбца, а отображается в дочерней строке.

Источник


Вот его рабочая демонстрация.

Похоже, вам это нужно:

https://datatables.net/reference/option/columns.responsivePriority

«Приоритет столбца также может быть определен атрибутом приоритета данных в ячейке заголовка столбца (например,« Имя »)».

Мик