Как убрать пробелы в кнопках нумерации страниц Datatables - PullRequest
Новая
       14

Как убрать пробелы в кнопках нумерации страниц Datatables

0 голосов
/ 09 сентября 2018

Не могли бы вы помочь мне найти способ убрать пробелы в кнопках нумерации таблиц данных?

enter image description here

Я сослался на следующие URL для этого:

ТАБЛИЦА ДАННЫХ BOOTSTRAP 4 ПРИМЕР

Я добавил файлы .js и CSS точно так, как было сказано выше, но это не сработало.

Кнопки нумерации страниц Datatables - удаление ненужного места

Ничего из вышеперечисленного не работает. Пожалуйста, помогите мне переопределить текущую функциональность. Спасибо.

Пожалуйста, найдите код, который я работал ниже:

HTML 

  <!-- BOOTSTRAP -->
  <link rel="stylesheet" href="stylesheets/bootstrap.min.css">
  <script src="javascript/third_party/popper.min.js"></script>
  <script src="javascript/third_party/bootstrap.min.js"></script>


  <!-- DATA TABLES -->
  <link rel="stylesheet" href="https://cdn.datatables.net/v/bs4/dt-1.10.18/datatables.min.css" />
  <script src="https://cdn.datatables.net/v/bs4/dt-1.10.18/datatables.min.js"></script>
  <script src="https://cdn.datatables.net/plug-ins/1.10.19/sorting/datetime-moment.js"></script>

CSS 

.dataTables_wrapper .dataTables_paginate .paginate_button {
  padding : 0px;
  margin-left: 0px;
  display: inline;
  border: 0px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  border: 0px;
}

Jquery 

$.fn.dataTable.moment('MM/DD/YYYY');
  $(`#${ID}`).DataTable({
    columnDefs: [{
      targets: [0, 1, 2, 5, 6, 7],
      orderable: false
    }],
    "order": [[4, "asc"]]
  });

1 Ответ

0 голосов
/ 10 сентября 2018

После стольких исследований я обнаружил, что

при использовании начальной загрузки CSS, не используйте jquery.dataTables.css с ним. иначе это создаст проблему интервала в нумерации страниц.

Bootstrap Datatable 4 независимо работает хорошо, как вы видите в JsBin , который я создал.

Надеюсь, если вы укажете правильный URL-адрес poper.js , который выглядит следующим образом: иначе это также создаст проблему с начальной загрузкой 4 CSS. 

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>

РЕДАКТИРОВАТЬ:
Если вы видите ниже codepen , который имеет ту же проблему, с которой вы столкнулись.

если вы откроете этот кодовый блок и удалите следующую строку, и он будет работать нормально для вас. 

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10-dev/css/jquery.dataTables.css">

Надеюсь, это может сработать для вас. если нет, прокомментируйте ниже.

...