Question: Jquery dataTable hide searchBox but show entries downdrop

Question

Jquery dataTable hide searchBox but show entries downdrop

Answers 1
Added at 2016-12-30 07:12
Tags
Question

I am trying to hide the search textbox of datatable and use my own custom textbox as I add icon to it.

Now, if I hide the search box using below code, it hides the show entries dropdown as well.

Any way to hide only the searchbox and remain the show entry drop down or using a custom drop down as replacement?

$(document).ready(function() {
    oTable = $('#example').DataTable(

        {
            "bFilter": false,
            searching: true,
            dom: "t",//show only table and hide the entry dropdown and searchbox
            "bLengthChange": true,
            "info": false

        });
    $('#searchText').keyup(function () {
        oTable.search($(this).val()).draw();
    })
});

Updated Code from tomloprod

  $(document).ready(function () {
    oTable = $('#example').DataTable(

        {
            "bFilter": false,
            searching: true,
            "sDom": "l"//show only table and entry dropdown and searchbox


        });
    $('#searchText').keyup(function () {
        oTable.search($(this).val()).draw();
    })

});

Answers to

Jquery dataTable hide searchBox but show entries downdrop

nr: #1 dodano: 2016-12-30 07:12

Try with this sDom:

"sDom": "rt<'fluid-row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>><'fluid-row'<'col-md-12 col-sm-12'<'pull-right'l>>>"

If you are not using bootstrap, you can remove this grid and use directly:

"sDom": "rtipl"


You can see how this works here: http://jsfiddle.net/za3jogqm/


You should read DataTables documentation to take full advantage of this functionality.

[...]

The following options are allowed:

l - Length changing
f - Filtering input
t - The table!
i - Information
p - Pagination
r - pRocessing

[...]

Source Show
◀ Wstecz