Php 正在尝试创建可下载的制表器表,但未显示任何内容

Php 正在尝试创建可下载的制表器表,但未显示任何内容,php,tabulator,Php,Tabulator,我试图在我的项目上实现一个可下载的表,我有所有需要的CDN,并且制表器已经由节点安装。我在拉威尔编程。这是我目前的代码: <div id="example-table"></div> <script type="text/javascript"> //Build Tabulator var tabledata = [ {id:1, name:"Oli Bob", progress:"12", gender:"red", rating:"", col:"

我试图在我的项目上实现一个可下载的表,我有所有需要的CDN,并且制表器已经由节点安装。我在拉威尔编程。这是我目前的代码:

<div id="example-table"></div>
<script type="text/javascript">
//Build Tabulator
  var tabledata = [
  {id:1, name:"Oli Bob", progress:"12", gender:"red", rating:"", col:"", dob:"", car:""}];
  table.setData(tableData);
var table = new Tabulator("#example-table", {
    data:tabledata,
    height:"311px",
    columns:[
        {title:"Name", field:"name", width:200},
        {title:"Progress", field:"progress", width:100, sorter:"number"},
        {title:"Gender", field:"gender"},
        {title:"Rating", field:"rating", width:80},
        {title:"Favourite Color", field:"col"},
        {title:"Date Of Birth", field:"dob", align:"center", sorter:"date"},
        {title:"Driver", field:"car", align:"center", formatter:"tickCross"},
    ],
});

//trigger download of data.csv file
$("#download-csv").click(function(){
    table.download("csv", "data.csv");
});

//trigger download of data.json file
$("#download-json").click(function(){
    table.download("json", "data.json");
});

//trigger download of data.xlsx file
$("#download-xlsx").click(function(){
    table.download("xlsx", "data.xlsx", {sheetName:"My Data"});
});

//trigger download of data.pdf file
$("#download-pdf").click(function(){
    table.download("pdf", "data.pdf", {
        orientation:"portrait", //set page orientation to portrait
        title:"Example Report", //add title to report
    });
});

</script>
<script type="text/javascript">
</script>
</div>
/////////////////////////////////CDN/////////////////////////////////////

  <script src="https://kit.fontawesome.com/d6743b0f97.js" crossorigin="anonymous"></script>
  <link href="dist/css/tabulator.min.css" rel="stylesheet">
  <script type="text/javascript" src="dist/js/tabulator.min.js"></script>
  <link href="https://unpkg.com/tabulator-tables@4.4.3/dist/css/tabulator.min.css" rel="stylesheet">
  <script type="text/javascript" src="https://unpkg.com/tabulator-tables@4.4.3/dist/js/tabulator.min.js"></script>
  <script type="text/javascript" src="http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.0.5/jspdf.plugin.autotable.js"></script>
  <link href="dist/css/tabulator.css" rel="stylesheet">
  <script type="text/javascript" src="dist/js/tabulator.js"></script>
  <script type="text/javascript" src="dist/js/tabulator_core.js"></script>
  <script type="text/javascript" src="dist/js/tabulator_core.min.js"></script>
  <script type="text/javascript" src="dist/js/modules/format.min.js"></script>
  <script type="text/javascript" src="dist/js/tabulator_core.min.js"></script>
  <script type="text/javascript" src="dist/js/modules/format.min.js"></script>
  <script type="text/javascript" src="dist/js/tabulator.min.js"></script>
  <script type="text/javascript" src="dist/js/jquery_wrapper.min.js"></script>
这就是我在体内得到的:
“无任何内容”

制表器仅管理表内的区域,它不会在表外创建按钮

您需要自己在页面上添加一个按钮:

<button id="download-csv">Download CSV</button>
另一方面,您包含了许多不需要的文件,如果您包含tablator.js,则不需要包含任何其他文件,因为它会将所有文件捆绑在一起


如果要使用tablator_core.js,则只需包含一次tablator_core.js或缩小版

浏览器开发工具中是否有任何错误?我已经解决了这个问题。谢谢你的提问。
$("#download-csv").click(function(){
    table.download("csv", "data.csv");
});