як видалити пагінацію в таблиці даних -


92

Я новачок у jQuery. Я використовував таблиці даних у сітці, але не потребую пагінації.

На одній сторінці є список замовлень, і я показую їх у сітці Datatable, але внизу я не хочу показувати пагінацію. Чи є спосіб видалити або приховати пагінацію з таблиці даних за допомогою бітової настройки в бібліотеці jQuery.

введіть тут опис зображення

Я намагався його налаштувати, але знайшов дуже мало методів для цього ..

Заздалегідь спасибі.


2
який метод чи плагін ви використовуєте?
Naryl

Відповіді:


163

Ви повинні включити "bPaginate": false,в об'єкт конфігурації, який ви передаєте своїм параметрам конструктора. Як видно тут: http://datatables.net/release-datatables/examples/basic_init/filter_only.html


1
Якщо я хочу відобразити лише 100 перших рядків моїх даних, bPaginate не працює, оскільки відображає всі дані незалежно від мого параметра iDisplayLength. Ви знаєте, як цього уникнути?
Alexis Dufrenoy

Виправте мене, якщо я помиляюся, але якщо ви показуєте лише перші 100 елементів і відключаєте пагінацію, користувач не має можливості відобразити такий результат. Якщо так, тоді вам слід спробувати змінити джерело даних безпосередньо. Здається, це інше питання, тому вам слід подумати про відкриття нового питання та надати нам свій код.
nstCactus

1
Насправді, це для функції пошуку, і мені також потрібно відобразити повідомлення про те, що користувачеві потрібно змінити критерії пошуку, оскільки було отримано забагато рядків. Для запису я запитав на форумі Datatables, і рішення полягає в тому, щоб додати опцію: sDom = lfrt (без "p", без пагінації). Може бути корисним ...
Alexis Dufrenoy

71

ВІДМОВИТИ ПАГІНАЦІЮ

Для таблиць даних 1.9

Використовуйте bPaginateопцію, щоб вимкнути пагінацію.

$('#example').dataTable({
    "bPaginate": false
});

Для таблиць даних 1.10+

Використовуйте pagingопцію, щоб вимкнути пагінацію.

$('#example').dataTable({
    "paging": false
});

Код і демонстрацію див. У цій jsFiddle .

ВИДАЛІТЬ КОНТРОЛЬ СТРАХУВАННЯ І ЗАЛИШИТИ УВІМКНЕНУ СТРАНИЦЮ

Для таблиць даних 1.9

Використовуйте sDomопцію, щоб налаштувати, які елементи управління відображатимуться на сторінці.

$('#example').dataTable({
    "sDom": "lfrti"
});

Для таблиць даних 1.10+

Використовуйте domопцію, щоб налаштувати, які елементи управління відображатимуться на сторінці.

$('#example').dataTable({
    "dom": "lfrti"
});

Код і демонстрацію див. У цій jsFiddle .


2
для версії 1.10+ data-paging='false'також буде працювати специфікація елемента таблиці.
Jeromy French

21

Це працює

Спробуйте нижче код

$('#example').dataTable({
    "bProcessing": true,
    "sAutoWidth": false,
    "bDestroy":true,
    "sPaginationType": "bootstrap", // full_numbers
    "iDisplayStart ": 10,
    "iDisplayLength": 10,
    "bPaginate": false, //hide pagination
    "bFilter": false, //hide Search bar
    "bInfo": false, // hide showing entries
})

20
$(document).ready(function () {
            $('#Grid_Id').dataTable({
                "bPaginate": false
            });
        });

я вирішив свою проблему, використовуючи його.


12
$('#table_id').dataTable({    
    "bInfo": false, //Dont display info e.g. "Showing 1 to 4 of 4 entries"
    "paging": false,//Dont want paging                
    "bPaginate": false,//Dont want paging      
})

Спробуйте цей код


6

якщо ви хочете видалити пагінацію і хочете упорядкувати таблицю даних, додайте цей скрипт в кінці вашої сторінки!

<script>
$(document).ready(function() {        
    $('#table_id').DataTable({
        "paging":   false,
       "info":     false
    } );
      
  } );
</script>


-1

Ось альтернатива, яка є поступовим покращенням кількох інших відповідей. Якщо взяти параметри. ALengthMenu не є багатовимірним (це може бути, коли DataTables має довжини рядків та мітки), і дані не змінюватимуться після завантаження сторінки (для простих DOM-завантажених DataTables), цю функцію можна вставити для усунення підкачки. Він приховує кілька класів, пов’язаних із пейджингом.

Можливо, більш надійним було б встановити для пейджингу значення false у нижченаведеній функції, однак я не бачу виклику API для цього від руки.

$('#myTable').on('init.dt', function(evt, settings) {
    if (settings && settings.aLengthMenu && settings.fnRecordsTotal && settings.fnRecordsTotal() < settings.aLengthMenu[0]) {
        // hide pagination controls, fewer records than minimum length
        $(settings.nTableWrapper).find('.dataTables_paginate, .dataTables_length, .dataTables_info').hide();
    }
}).DataTable();
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.