Buttons not visible

mhja

I try to include buttons, but they will not show up.

This is what I'm trying

$(document).ready(function () {
    $('#myTable').DataTable({
    "dom": '<lfip<t>r>',
        "initComplete": function() {
        this.api().buttons().container()
            .appendTo( '#myTable_info .col-sm-6:eq(0)' );
    },
    language: {
        select: {
                    rows: "&nbsp;&nbsp;&nbsp;<b>%d rader valda</b>"
            },
        "emptyTable":     "Ingen data i tabell",
        "info":           "Visar _START_ till _END_ av _TOTAL_ &nbsp;",
        "infoEmpty":      "Visar 0 till 0 av 0",
        "infoFiltered":   "(filtrerad från _MAX_)",
        "infoPostFix":    "",
        "loadingRecords": "Laddar...",
        "processing":     "",
        "search":         "Sök:",
        "zeroRecords":    "Inga matchande data funna",
    },
    buttons: [
            'copy',
        'csv',
        'excel',
        'pdf',
        'print'
        ],
    paging: false,
        ordering: true,
        info: true,
    responsive: true,
//  select: {
//            style: 'multi'
//        },
    select: true,
        order: [[0, 'desc']],
    lengthMenu: [
            [-1, 10, 25, 50],
            ['All', 10, 25, 50],
        ]
    });

    $('input.global_filter').on('keyup click', function () {
        filterGlobal();
    });

    $('input.column_filter').on('keyup click', function () {
         filterColumn($(this).parents('tr').attr('data-column'));
    });

    $('#reset').click( function (e) {
          table.colReorder.reset();
     } );

});

Please advise, what should be changed in order to get the Buttons visible.

Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

kthorngren

It looks like you are using Bootstrap based on the selector you are using in this code:

    "dom": '<lfip<t>r>',
        "initComplete": function() {
        this.api().buttons().container()
            .appendTo( '#myTable_info .col-sm-6:eq(0)' );
    },

If so change the dom option to use the appropriate Bootstrap styling as shown in the examples. Looks like you want to place the buttons below the table. You might need to adjust the column classes in the default styling of "<'row'<'col-sm-5'i><'col-sm-7'p>>".

Kevin