CODEWITHSUNDEEP
javascriptjqueryjquery-uidatatabletabletools
ramtamtam
ramtamtam

Reputation: 91

jQuery datatables tabletools buttons didn't show up

Can anyone explain why TableTools (http://datatables.net/extensions/tabletools/) not show up.

I'm using the following js sources:

<script src="external/jquery/jquery.js"></script> //Version 1.10.2
<script src="jquery-ui.js"></script> //Version 1.11.2
<script src="jquery.dataTables.js"></script> // Version 1.10.4
<script src="dataTables.tableTools.js"></script> //Version 2.2.3

Thats the js for the datatable and tabletools.

$('#report-datatable').dataTable({
            "processing": true,
            "serverSide": false,
            "paging": false,
            "ajax": {
                type: 'POST',
                url: 'sources/report_table.php',
                data: {
                    miDate: minval,
                    maDate: maxval,
                    retour: sap_retour,
                    hubew: sap_hubew,
                    nolkscan: nolkscan
                }
            },
            "columns": [
                { "data": "LSAP" },
                { "data": "DatumSAP" },
                { "data": "Warenempfaenger" },
                { "data": "LSLK" },
                { "data": "DatumLK" }
            ],
            "createdRow": function (row, data, index) {
                if (data['LSLK'] == null){
                    $(row).css('background-color', 'lightcoral');
                }
            },
            "dom": 'T<"fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"lr>t<"fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip>',
            "TableTools": {
                "Buttons": [
                    "print",
                    {
                        "Extends":    "collection",
                        "ButtonText": "Save",
                        "Buttons":    [ "csv", "xls", "pdf" ]
                    }
                ]
            },
            "destroy": true
        });

Everything works exprect the tabletools.

Thanks!

Upvotes: 2

Views: 3351

Answers (1)

ramtamtam
ramtamtam

Reputation: 91

Solution:

$(document).ready(function() {
var report1table = $('#report1-datatable').dataTable();
function reporttable(minval,maxval,sap_retour,sap_hubew,nolkscan){
        $.ajax({
            type: 'POST',
            url: 'sources/report_table_scans.php',
            data: {
                miDate: minval,
                maDate: maxval,
                retour: sap_retour,
                hubew: sap_hubew,
                nolkscan: nolkscan
            },
            success: function(result){
                obj = JSON.parse(result);
                loadDatatable(obj['data']);
            },
            error: function (result) {
                alert('Fehler beim Laden der Daten. ' + result.responseText);
            }
        });
    };
    function loadDatatable(aaData){
        report1table.dataTable({
            "dom": 'Tti',
            "deferRender": true,
            "serverSide": false,
            "paging": false,
            "data": aaData,
            "columns": [
                { "data": "LSAP" },
                { "data": "DatumSAP" },
                { "data": "Warenempfaenger" },
                { "data": "LSLK" },
                { "data": "DatumLK" }
            ],
            "createdRow": function (row, data, index) {
                if (data['LSLK'] == null){
                    $(row).css('background-color', 'lightcoral');
                }
            },
            tableTools: {
                "aButtons": [
                    "copy",
                    "print",
                    {
                        "sExtends":    "collection",
                        "sButtonText": "Save",
                        "aButtons":    [ "csv", "xls", "pdf" ]
                    }
                ]
            },
            "destroy": true
        });
    };

Upvotes: 1

Related Questions