CODEWITHSUNDEEP
jquerydatatables
Chandan Kumar
Chandan Kumar

Reputation: 4638

How to Remove search and export buttons if no data available in datatable

I want to remove the "Search" and "Export (copy,excel,csv,pdf...etc) Buttons" if data is not available in the datatable.

I can able to find out the length of the datatable is "0" but unable to find any solution how to remove the buttons and search control.

Currently datatable is showing "No data Available" which is required for me. I can able to show the dattable properly.

This is what i have tried so far.

var table = $('#tblParametersPopUp').dataTable(
{
    dom: 'Bfrt',
    bPaginate: false,
    oLanguage: {
        sSearch: '<i class="fa fa-search">&nbsp; </i>'
    },
    buttons: [
                {
                    extend: 'copy',
                    text: '<i class="fa fa-files-o"></i>',
                    titleAttr: 'Copy'
                },
                {
                    extend: 'excel',
                    text: '<i class="fa fa-file-excel-o"></i>',
                    titleAttr: 'Excel'
                },
                {
                    extend: 'csv',
                    text: '<i class="fa fa-file-text-o"></i>',
                    titleAttr: 'CSV'
                },
                {
                    extend: 'pdf',
                    text: '<i class="fa fa-file-pdf-o"></i>',
                    titleAttr: 'PDF'
                },
                {
                    extend: 'print',
                    text: '<i class="fa fa-print"></i>',
                    titleAttr: 'Print'
                }
    ]
    //,
    ////initialization params as usual
    //fnInitComplete: function () {
    //    if ($(this).find('tbody tr').length <= 1) {
    //        $(this).parent().hide();
    //    }
    //}
});
if(table.fnSettings().aoData.length == "0")
{
    //alert('no data');
    //I want to remove the default search and export buttons here.
}

Please Help!

Upvotes: 3

Views: 3604

Answers (2)

PHP Worm...
PHP Worm...

Reputation: 4224

For this you can use drawCallback

drawCallback: function (settings) {
                $this.datatable.button(0).enable(settings.json.recordsTotal > 0);
                $this.datatable.button(1).enable(settings.json.recordsTotal > 0);
                $this.datatable.button(2).enable(settings.json.recordsTotal > 0);
            }

Upvotes: 0

Deep 3015
Deep 3015

Reputation: 10075

You can check whether table is empty or not and if empty destroy table and initialize datatable with search disable

$(document).ready(function() {
 var table =$('#example').DataTable( {
        dom: 'Bfrtip',
        buttons: [
            'copyHtml5',
            'excelHtml5',
            'csvHtml5',
            'pdfHtml5'
        ]
    } );
if ( ! table.data().count() ) {
    $('#example').dataTable().fnDestroy();
        $('#example').DataTable( {
        searching: false
    })
}
} );

Upvotes: 1

Related Questions