DataTable: Sembunyikan dropdown Tampilkan Entri tetapi simpan kotak Pencarian

129

Apakah mungkin untuk menyembunyikan dropdown Tampilkan Entri tetapi menyimpan kotak Pencarian di DataTable? Saya ingin selalu menampilkan 10 baris dengan pagination di bagian bawah bersama dengan kotak pencarian tetapi tidak ingin menampilkan dropdown Tampilkan entri.

FaisalKhan
sumber

Jawaban:

288

Anda dapat menemukan informasi lebih lanjut secara langsung di tautan ini: http://datatables.net/examples/basic_init/filter_only.html

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

Semoga itu bisa membantu!

EDIT: Jika Anda malas, "bLengthChange": false, adalah yang perlu Anda ubah :)

PERPO
sumber
56

Jika menggunakan Datatable> 1.1.0 maka lengthChangeopsi adalah apa yang Anda butuhkan seperti di bawah ini:

$('#example').dataTable( {
  "lengthChange": false
});
Jimmy Obonyo Abor
sumber
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
sumber
19

Ini adalah kunci jawaban untuk posting ini yang "bLengthChange": false,akan menyembunyikan Entri Dropdown


sumber
9

Untuk DataTables <= 1.9, jawaban @perpo

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

berfungsi dengan baik, tetapi untuk 1,10+ coba ini:

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

di mana kami telah meninggalkan l"panjang kontrol input berubah"

1.9 Documents

1.10 Dokumen

Michal Frystacky
sumber
ini lebih baik karena menghapus div holdint elemen. dengan elemen bLenghChange hilang tetapi ada spasi putih. terima kasih!
Hamid Salari
9

Saya menyelesaikannya seperti itu. Gunakan bootstrap 4

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

cdn js:

cdn css:

shades3002
sumber
1
Ini berfungsi untuk data pada 2018, tidak ada yang melakukannya.
Dammeul
8

sDom: "Tfrtip" atau melalui panggilan balik:

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

Untuk menonaktifkan label "Tampilkan Entri", tambahkan kode dom: 'Bfrtip' atau Anda dapat menambahkan "bInfo": false

$('#example').DataTable({
    dom: 'Bfrtip'
})
chitranjan srivastva
sumber
2

Anda dapat mencoba ini juga.

cukup sembunyikan dari CSS dengan menggunakan,

 .dataTables_length {
        display: none;
    }

Keduanya akan bekerja.

Rupesh Kamble
sumber
2

Tulis saja:

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

Untuk menyembunyikan "tampilkan entri" tetapi masih memiliki pagination. Saya menggunakan kode di bawah ini dan berhasil.

"bPaginate": true,
"bLengthChange": false,
"bFilter": true,
"bInfo": false,
"bAutoWidth": false
ejay56
sumber
1

Tambahkan opsi ini:

"bInfo": false
cyber8200
sumber
0

Untuk menonaktifkan label "Tampilkan Entri", gunakan "bInfo", contoh: "bFilter" adalah komponen pencarian, tetapi aktif secara default.

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

Mengaktifkan atau menonaktifkan tampilan informasi tabel. Ini menunjukkan informasi tentang data yang saat ini terlihat di halaman, termasuk informasi tentang data yang difilter jika tindakan itu dilakukan.

steffanjj
sumber