Cambiar los valores del cuadro de selección de "mostrar 10 entradas" de jquery datatable


Por defecto, jquery datatable muestra 10 por defecto y tiene

Opciones : 10,25,50,100

¿Cómo puedo cambiar estas opciones?

Author: Gyrocode.com, 2012-05-17

8 answers

No olvides cambiar la longitud de iDisplay también:

$(document).ready(function() {
    $('#tbl_id').dataTable({
        "aLengthMenu": [[25, 50, 75, -1], [25, 50, 75, "All"]],
        "iDisplayLength": 25
    });
} );
 121
Author: davesave,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-04-18 15:17:02
$(document).ready(function() {
    $('#example').dataTable( {
    "aLengthMenu": [[25, 50, 75, -1], [25, 50, 75, "All"]],
    "pageLength": 25
    } );
} );

ALengthMenu : Este parámetro le permite especificar fácilmente las entradas en el menú desplegable longitud que las tablas de datos muestran cuando la paginación está habilitada. Puede ser una matriz 1D de opciones que se utilizará tanto para la opción mostrada como para el valor, o una matriz 2D que utilizará la matriz en la primera posición como el valor, y la matriz en la segunda posición como las opciones mostradas (útil para cadenas de idioma como 'All').

Update

Desde DataTables v1. 10, las opciones que está buscando son pageLength y lengthMenu

 38
Author: Priyank Patel,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-06-15 10:12:46

En mi caso , aLengthMenu no está funcionando. Así que usé esto. Y está funcionando.

jQuery('#dyntable3').dataTable({            
            oLanguage: {sLengthMenu: "<select>"+
            "<option value='100'>100</option>"+
            "<option value='200'>200</option>"+
            "<option value='300'>300</option>"+
            "<option value='-1'>All</option>"+
            "</select>"},
            "iDisplayLength": 100

        });

Gracias

 7
Author: Mira Padalia,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-12-03 07:07:22

Según datatables.net la forma correcta de hacer esto es agregar la propiedad lengthMenu con una matriz de valores.

$(document).ready(function() {
    $('#example').dataTable( {
        "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
    } );
} );
 6
Author: MZaragoza,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-01-22 15:29:23
 $('#tblSub1View').dataTable({
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "bDestroy": true,
                    "aoColumnDefs": [{
                        'bSortable': false,
                        'aTargets': [0, 1]
                    }],
                    "aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
                    "iDisplayLength": 10,
                });
 4
Author: user3789888,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-07-17 11:55:27

Si hace clic en algún botón,a continuación, cambiar los datatables el displaylenght,puede probar esto :

 $('.something').click( function () {
var oSettings = oTable.fnSettings();
oSettings._iDisplayLength = 50;
oTable.fnDraw();
});

oTable = $('#example').dataTable();
 2
Author: nihaoqiulinhe,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-12-14 02:23:18

Si desea usar 'lengthMenu' junto con los botones(copiar, exportar), debe usar esta opción dom: 'lBfrtip'. Aquí https://datatables.net/reference/option/dom puedes encontrar el significado de cada símbolo. Por ejemplo, si va a utilizar así 'Bfrtip', lengthMenu no aparecerá.

 1
Author: Kirill A,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-12-19 11:12:27

introduzca la descripción de la imagen aquí Longitud de página: 50,

Funcionó para mí Gracias

Versiones para referencia

Jquery-3.3.1.js

/ 1.10.19 / js / jquery.DataTables.min.js

/buttons/1.5.2/js/DataTables.botón.min.js

 0
Author: subramanya4,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-06-30 06:53:25