Как я могу показать более 1 строки в отзывчивом представлении Datatables.net? - PullRequest
2 голосов
/ 20 июня 2019

Это моя таблица в режиме рабочего стола: image

В режиме адаптивного или мобильного просмотра, только пользователь может просматривать название страны без нажатия кнопки + в данный момент, но я хочупоказывать (имя, цена покупки, цена продажи) без нажатия кнопки «+», а когда пользователь нажимает кнопку «+», показывать пользователю другие столбцы (дата, график, название страны).
как я могу сделать это с таблицами datatables.net?

1 Ответ

0 голосов
/ 20 июня 2019

Doc:

https://datatables.net/extensions/responsive/examples/column-control/columnPriority.html

Итак, вы должны правильно использовать responsivePriority в columnDefs в конструкторе DataTable:

$(document).ready(function() {
    $('#example').DataTable( {
        responsive: true,
        columnDefs: [
            { responsivePriority: 1, targets: 1 }, // name
            { responsivePriority: 2, targets: 2 }, // buy price
            { responsivePriority: 3, targets: 3 }, // sell price
            { responsivePriority: 4, targets: 0 },
            { responsivePriority: 5, targets: 4 },
            { responsivePriority: 6, targets: 5 }
        ]
    } );
} );

EDIT

Хорошо, это сложнее, так что ... Во-первых, используйте это для fixed columns: Как исправить последний столбец отзывчивой таблицы данных , а затем использовать плагин row_details (необходимо заполнить де данных внутри каждой строки путем итерации текущей строки): https://datatables.net/examples/api/row_details.html

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...