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.


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


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.


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
})

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

He resuelto mi problema usándolo.


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


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>


-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();
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.