DataTable: oculte o menu suspenso Mostrar entradas, mas mantenha a caixa Pesquisar

129

É possível ocultar o menu suspenso Mostrar entradas, mas manter a caixa Pesquisar no DataTable? Quero sempre exibir 10 linhas com paginação na parte inferior junto com a caixa de pesquisa, mas não quero exibir o menu suspenso Mostrar entradas.

datatable dt

— FaisalKhan
fonte

288

Você pode encontrar mais informações diretamente neste link: http://datatables.net/examples/basic_init/filter_only.html

$(document).ready(function() {
$('#example').dataTable({
    "bPaginate": false,
    "bLengthChange": false,
    "bFilter": true,
    "bInfo": false,
    "bAutoWidth": false });
});

Espero que ajude !

EDIT: Se você é preguiçoso, "bLengthChange": false, é o que você precisa alterar :)

— PERPO
fonte

56

Se estiver usando Datatable> 1.1.0, a lengthChangeopção é o que você precisa, conforme abaixo:

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

— Jimmy Obonyo Abor
fonte

28

"searching": false,   // Search Box will Be Disabled

"ordering": false,    // Ordering (Sorting on Each Column)will Be Disabled

"info": true,         // Will show "1 to n of n entries" Text at bottom

"lengthChange": false // Will Disabled Record number per page

— Niv
fonte

19

Esta é a resposta chave para esta postagem "bLengthChange": false,ocultar o menu suspenso de entradas

9

Para DataTables <= 1.9, a resposta do @perpo

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

funciona bem, mas para 1.10 ou superior, tente o seguinte:

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

onde deixamos de fora lo "controle de entrada de alteração de comprimento"

1.9 Documentos

1.10 Documentos

— Michal Frystacky
fonte

isso é melhor porque remove a div holdint o elemento com o elemento bLenghChange desapareceu, mas há espaço em branco. obrigado !

— Hamid Salari 19/07

9

Eu resolvo assim. Use o bootstrap 4

    $(document).ready(function () {
        $('#table').DataTable({
            "searching": false,
            "paging": false,
            "info": false
        });
    });

cdn js:

cdn css:

— shades3002
fonte

1

Isso funciona para tabelas de dados em 2018, nenhum dos outros funcionou.

— Dammeul 18/10/19

8

sDom: "Tfrtip" ou por meio de um retorno de chamada:

"fnHeaderCallback": function(){
    $('#YOURTABLENAME-table_length').hide();
}

— cnizzardini
fonte

3

Para desabilitar o rótulo "Mostrar entradas", adicione o código dom: 'Bfrtip' ou você pode adicionar "bInfo": false

$('#example').DataTable({
    dom: 'Bfrtip'
})

— chitranjan srivastva
fonte

2

Você pode tentar isso também.

simplesmente oculte-o do CSS usando,

 .dataTables_length {
        display: none;
    }

Ambos irão funcionar.

— Rupesh Kamble
fonte

2

Apenas escreva :

  $(document).ready( function () {
        $('#example').dataTable( {
          "lengthChange": false
        } );
    } );

— Hasan Sheikh
fonte

1

Para ocultar "mostrar entradas", mas ainda ter paginação. Eu usei o código abaixo e funcionou.

"bPaginate": true,
"bLengthChange": false,
"bFilter": true,
"bInfo": false,
"bAutoWidth": false

— ejay56
fonte

1

Adicione esta opção:

"bInfo": false

— cyber8200
fonte

0

Para desativar o rótulo "Mostrar entradas", use "bInfo", por exemplo: "bFilter" é o componente de pesquisa, mas está ativo por padrão.

$(document).ready( function () {
  $('#example').dataTable( {
    "bInfo": false
  } );
} );

Ative ou desative a exibição de informações da tabela. Isso mostra informações sobre os dados atualmente visíveis na página, incluindo informações sobre dados filtrados, se essa ação estiver sendo executada.

— steffanjj
fonte