Laravel 7 Яджра дататабельно НЕ реагирует - PullRequest
0 голосов
/ 03 мая 2020

Я использую Yajra datatable из учебника Weblesson.

Все работает отлично, но таблица данных НЕ отвечает.

Я включил этот код:

$('#user_table').DataTable({
  responsive: true,

Благодаря Омеру:

Я добавил два CDN:

  <script src="https://cdn.datatables.net/responsive/2.2.3/js/responsive.bootstrap4.min.js"></script>
  <link rel="https://cdn.datatables.net/rowgroup/1.1.1/css/rowGroup.bootstrap4.min.css" />

, и Я УДАЛЕН:

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />

Теперь все работает отлично.

Как вы можете на этой фотографии, мой стол отзывчив:

enter image description here

РЕДАКТИРОВАТЬ:

Спасибо Омеру:

Я добавил два CDN:

  <script src="https://cdn.datatables.net/responsive/2.2.3/js/responsive.bootstrap4.min.js"></script>
  <link rel="https://cdn.datatables.net/rowgroup/1.1.1/css/rowGroup.bootstrap4.min.css" />

, и я УДАЛЕН:

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />

Теперь все работает отлично.

Спасибо.

Ответы [ 2 ]

1 голос
/ 03 мая 2020

Bootstrap table-responsive добавить стиль overflow-x: auto в ваш тег. Так что bootstrap отзывчивый работает на вашем сайте. Если вы хотите, чтобы datatable реагировал, вы должны добавить расширение: https://datatables.net/extensions/responsive

Responsive - это расширение для DataTables, которое решает эту проблему путем оптимизации макета таблицы для экранов разных размеров. через динамику c вставка и удаление столбцов из таблицы.

0 голосов
/ 03 мая 2020

Я скопировал и вставил ваш код как есть в новый файл, открыл его и протестировал: нет проблем

enter image description here


Теперь слишком легко сказать, что это работает, проблема на вашей стороне ...

Итак, я провел несколько тестов:

  1. Firefox 75 => OK
  2. Edge 81.0.416.68 => OK
  3. Even IE 11.778.18362.0

Мне кажется, это должен быть скорее браузер проблема (кеш, блокировка расширений браузера JS или CSS свойства ...)

Возможно, попробуйте другой браузер (портативный, чтобы не складываться на вашем компьютере ...)

Но это, вероятно, не имеет ничего общего со стековым потоком, поскольку это не вызвано неправильным пониманием кода или кода.

...