数据表按钮不显示使用jquery

时间:2016-12-14 13:35:35

标签: jquery-plugins datatables requirejs

我的数据表有问题。 使用require.js按钮没有像我期望的那样出现。 我试过没有require.js它工作正常,使用要求我有这个问题。

这里是代码段:

更新15.12.2016:

 var jobDataTable = function(){

    requirejs.config({
        baseUrl: "./assets",
        paths: {
             jquery: "js/vendor/jquery-1.11.1.min.js",
             bootstrap: 'js/bootstrap/js/bootstrap.min',
             datatables: 'plugins/dataTables/js/jquery.dataTables.min',
             'datatables.bootstrap': 'plugins/dataTables/js/dataTables.bootstrap.min',
             buttons: "plugins/dataTables/extensions/buttons/dataTables.buttons.min",
             colVis: "plugins/dataTables/extensions/buttons/buttons.colVis.min",
             html5: " plugins/dataTables/extensions/buttons/buttons.html5.min",
             flash: " plugins/dataTables/extensions/buttons/buttons.flash.min",       
             print: " plugins/dataTables/extensions/buttons/buttons.print.min",              
             jsZip: "js/jszip"
        },
        shim: {
            'bootstrap':{ deps:['jquery']},
            'datatables':{ deps:['jquery', 'bootstrap']},
             'datatables.bootstrap':{ deps:['datatables']},       
            'buttons': { deps:['datatables']}, 
            'html5': { deps:['datatables', 'buttons']},
            'flash': { deps:['datatables', 'buttons']},
            'colVis':{ deps:['datatables', 'buttons']},
            'print': { deps:['datatables', 'buttons']}
        }
    });


require(['jquery', 'bootstrap', 'datatables'], function($){

    var dataset = app.getJobsByUser();

    var jobTable = $('#axCsJobsTable').DataTable({
            aaData: dataset,
            dom: 'Bfrtip',
            buttons: [
              'copy', 'csv', 'excel', 'pdf', 'print'
            ],
            aoColumns: [
                { "mDataProp": "JOB_ID" },
                { "mDataProp": "JOB_NAME" },
                { "mDataProp": "JOB_EXPORT_DATE" },
                { "mDataProp": "JOB_EXPORT_FORMAT" },
                { "mDataProp": "JOB_CDATE" },
                { "mDataProp": "JOB_STATUS", 
                "sClass": "status",
                "mRender": function (data, type, row) {
                        if (parseFloat(data) > 0) {
                            return "<span class='glyphicon glyphicon-ok-circle'></span>";
                        } else {
                            return "<span class='glyphicon glyphicon-time'></span>";
                        }
                    }
                },
                {
                "mDataProp": null,
                "className": "center",
                "defaultContent": "<button id='axCsJobRemove' type='button' class='btn btn-default btn-sm'> <span class='glyphicon glyphicon-trash'></span> Delete </button>"
                },
                {
                "mDataProp": null,
                "className": "center",
                "defaultContent": "<button id='axCsJobConvert' type='button' class='btn btn-default btn-sm'> <span class='glyphicon glyphicon-save'></span> Convert </button>"
                }                 
            ]
        }); 

        $('#axCsJobsTable tbody').on( 'click', '#axCsJobRemove', function () {
            var data = jobTable.row( $(this).parents('tr') ).data();
            if (removeJob(data)==1){
                jobTable
                .row( $(this).parents('tr') )
                .remove()
                .draw();
            }       
        });

        $('#axCsJobsTable tbody').on( 'click', '#axCsJobConvert', function () {
            var data = jobTable.row( $(this).parents('tr') ).data();
            if(startJob(data)==1){
                console.log('Job run successfully');
                $('#axCsJobsTable').dataTable().fnDestroy();
                setTimeout(function() { jobDataTable(); }, 3000);                
            }                
        });
    });  

}

它挂起的一些想法? 缺少一些依赖项?

此致 帕特里克

0 个答案:

没有答案