cómo eliminar la paginación en la tabla de datos

92

Soy nuevo en jQuery. He usado tablas de datos en la cuadrícula pero no necesito paginación.

Hay una lista de pedidos en una página y los muestro en una cuadrícula de Datatable pero en la parte inferior no quiero mostrar la paginación. ¿Hay alguna forma de eliminar u ocultar la paginación de la tabla de datos utilizando una personalización de bits en la biblioteca jQuery?

ingrese la descripción de la imagen aquí

Intenté personalizarlo, pero encontré muy pocos métodos para hacerlo.

Gracias por adelantado.

Toseef Khilji
fuente
2
¿Qué método o complemento estás usando?
Naryl

Respuestas:

163

Debe incluir "bPaginate": false,en el objeto de configuración que pasa a los parámetros de su constructor. Como se ve aquí: http://datatables.net/release-datatables/examples/basic_init/filter_only.html

nstCactus
fuente
1
Si quiero mostrar solo las 100 primeras líneas de mis datos, bPaginate no funciona porque muestra todos los datos independientemente de mi parámetro iDisplayLength. ¿Sabes cómo evitarlo?
Alexis Dufrenoy
Corríjame si me equivoco, pero si solo muestra los primeros 100 elementos y deshabilita la paginación, el usuario no tiene forma de mostrar el siguiente resultado. Si es así, debería intentar cambiar su fuente de datos directamente. Parece ser un problema diferente, por lo que debería considerar abrir una nueva pregunta y darnos parte de su código.
nstCactus
1
En realidad, es para una función de búsqueda y también necesito mostrar un mensaje que diga que el usuario debe cambiar sus criterios de búsqueda porque se recuperaron demasiadas líneas. Para que conste, pregunté en el foro de Datatables, y la solución es agregar una opción: sDom = lfrt (sin una "p", sin paginación). Puede ser útil ...
Alexis Dufrenoy
72

DESACTIVAR LA PAGINACIÓN

Para tablas de datos 1.9

Use la bPaginateopción para deshabilitar la paginación.

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

Para tablas de datos 1.10+

Use la pagingopción para deshabilitar la paginación.

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

Vea este jsFiddle para obtener código y demostración.

QUITAR EL CONTROL DE PAGINACIÓN Y DEJAR LA PAGINACIÓN HABILITADA

Para tablas de datos 1.9

Use la sDomopción para configurar qué elementos de control aparecen en la página.

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

Para tablas de datos 1.10+

Use la domopción para configurar qué elementos de control aparecen en la página.

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

Vea este jsFiddle para obtener código y demostración.

Gyrocode.com
fuente
2
para 1.10+, especificar data-paging='false'en el elemento de tabla también funcionará.
Jeromy French
21

Esta funcionando

Prueba el siguiente código

$('#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
})
Muhammad Fahad
fuente
20
$(document).ready(function () {
            $('#Grid_Id').dataTable({
                "bPaginate": false
            });
        });

He resuelto mi problema usándolo.

Toseef Khilji
fuente
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      
})

Prueba este código

Abhishek B Patel
fuente
6

si desea eliminar la paginación pero desea ordenar la tabla de datos, agregue este script al final de su página.

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

Mohsin Shoukat
fuente
-1

Aquí hay una alternativa que es una mejora incremental en varias otras respuestas. Suponiendo que settings.aLengthMenu no es multidimensional (puede ser cuando DataTables tiene longitudes de fila y etiquetas) y los datos no cambiarán después de la carga de la página (para DataTables simples cargados con DOM), esta función se puede insertar para eliminar la paginación. Oculta varias clases relacionadas con la paginación.

Quizás más robusto sería configurar la paginación en falso dentro de la función a continuación, sin embargo, no veo una llamada a la API para eso.

$('#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();
Ryanm
fuente