Why export buttons are not being displayed?

ppatel

I am loading all js and css files in order. JS code also seems fine. But still export buttons are not being displayed.

CSS Files

<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.13/css/jquery.dataTables.css">
<!-- DataTabesButtons-->
<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css">

JS Files

    <script type="text/javascript" src="//code.jquery.com/jquery-1.12.4.js"></script>

    <script type="text/javascript" src="/Resources/assets/plugins/jquery/jquery-migrate.min.js"></script>
    <script type="text/javascript" src="/Resources/assets/plugins/bootstrap/js/bootstrap.min.js"></script>

    <!-- DataTabes jQuery-->
    <script type="text/javascript" charset="utf8" src="http://cdn.datatables.net/1.10.13/js/jquery.dataTables.js"></script>


    <!-- DataTables Button-->

    <script type="text/javascript" src="http://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
    <script type="text/javascript" src="http://cdn.rawgit.com/bpampuch/pdfmake/0.1.24/build/pdfmake.min.js"></script>
    <script type="text/javascript" src="http://cdn.rawgit.com/bpampuch/pdfmake/0.1.24/build/vfs_fonts.js"></script>
    <script type="text/javascript" src="http://cdn.datatables.net/buttons/1.2.4/js/buttons.html5.min.js"></script>
    <script type="text/javascript" src="http://cdn.datatables.net/buttons/1.2.4/js/buttons.print.min.js"></script>
    <script type="text/javascript" src="http://cdn.datatables.net/buttons/1.2.4/js/buttons.colVis.min.js"></script>

JS code

var cols = [];
var exampleRecord = jsondata[0];

        var keys = Object.keys(exampleRecord);
        keys.forEach(function(k) {
            cols.push({
            title: k,
            data: k

            });
        });

            var table = $('#jsonTable').DataTable( {
            dom: 'Bfrtip',
            columns : cols,
            buttons: [
             'copyHtml5', 'excelHtml5', 'pdfHtml5', 'csvHtml5'
            ]

            } );

            table.rows.add(jsondata).draw();

kthorngren

I copied your CSS and JS includes and Datatable init code into this test case and the buttons appear. I did not copy the keys.forEach, columns: cols nor table.rows.add(jsondata).draw();.

Maybe you are getting an error before the buttons normally are initialized. Do you see any console messages?

Kevin

ppatel

Hi, Thanks for the comment. My problem got resolved after clearing cache. Again Thanks