How do I use the dom function to hide search box?

How do I use the dom function to hide search box?

ChazzaChazza Posts: 10Questions: 4Answers: 0
edited March 28 in Free community support

Hi
I understand accord to the following link I can use the dom function to hide the search box
[https://datatables.net/forums/discussion/22511/can-you-hide-the-search-box-without-disabling-searching]

Where is the dom function located please? is it buried within JavaScript somewhere? Have never used this before I am slightly lost as how to implement it?

Currently I set my table up with the script below. I want to keep the bit that lets me have the three search boxes below my table. I just want to permanently hide the main default search box. Thank you for your help
Chazza

  <script>
        var dataSet = %ALARMSTABLE%;

        $(document).ready(function () {

            // Setup - add a text input to each footer cell
            $('#altable tfoot th').each(function () {
                var title = $(this).text();
                $(this).html('<input type="text" placeholder="Search ' + title + '" />');
            });

            // DataTable
            var table = $('#altable').DataTable({                
                data: dataSet,                
                initComplete: function () {
                    // Apply the search
                    this.api().columns().every(function () {
                        var that = this;

                        $('input', this.footer()).on('keyup change clear', function () {
                            if (that.search() !== this.value) {
                                that
                                    .search(this.value)
                                    .draw();
                            }
                        });
                    });
                }
            });
         });
    </script>


This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 13,773Questions: 25Answers: 3,242
    Answer ✓

    The dom option is a Datatbles initialization option, not a function. It would go between lines 14 and 15, for example, in your code snippet.

    Kevin

  • ChazzaChazza Posts: 10Questions: 4Answers: 0

    Hi Kevin
    Thanks for the head up on that
    I added
    "bFilter": false,
    After line 14 and that removed the search box
    Regards
    Chazza

  • kthorngrenkthorngren Posts: 13,773Questions: 25Answers: 3,242

    Setting searching (the current naming convention - same as bFilter) to false will disable searching using the API. If you still want search capabilities but want to remove the search input use the dom option.

    Kevin

  • james8492james8492 Posts: 1Questions: 0Answers: 0
    edited September 21

    Add this code in internal ccs

    .dataTables_filter{
    display: none;
    }

    it's work properly

Sign In or Register to comment.