DataTable: Hide the Show Entries dropdown but keep the Search box

后端 未结 13 1425
再見小時候
再見小時候 2021-01-29 23:55

Is it possible to hide the Show Entries dropdown but keep the Search box in DataTable? I want to always display 10 rows with pagination at the bottom along with search box but d

相关标签:
13条回答
  • 2021-01-30 00:21

    I solve it like that. Use bootstrap 4

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

    cdn js:

    • https://code.jquery.com/jquery-3.3.1.min.js
    • https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js
    • https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js
    • https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js

    cdn css:

    • https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css
    • https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css
    0 讨论(0)
  • 2021-01-30 00:26

    To hide "show entries" but still have pagination. I used the code below and it worked.

    "bPaginate": true,
    "bLengthChange": false,
    "bFilter": true,
    "bInfo": false,
    "bAutoWidth": false
    
    0 讨论(0)
  • 2021-01-30 00:27

    To disable the "Show Entries" label, add the code dom: 'Bfrtip' or you can add "bInfo": false

    $('#example').DataTable({
        dom: 'Bfrtip'
    })
    
    0 讨论(0)
  • 2021-01-30 00:29

    To disable the "Show Entries" label, use "bInfo", example: "bFilter" is the search component, but are active by default.

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

    Enable or disable the table information display. This shows information about the data that is currently visible on the page, including information about filtered data if that action is being performed.

    0 讨论(0)
  • 2021-01-30 00:30

    Add this option:

    "bInfo": false
    
    0 讨论(0)
  • 2021-01-30 00:33

    You can try this also.

    simply hide it from CSS by using,

     .dataTables_length {
            display: none;
        }
    

    Both will work.

    0 讨论(0)
提交回复
热议问题