【问题标题】:JSON into Tabulator table- JavascriptJSON 到 Tabulator 表 - Javascript
【发布时间】:2018-05-13 13:30:24
【问题描述】:

我正在尝试将 JSON 从 URL 加载到 Tabulator 表中。我这里有一个 jsfiddle https://jsfiddle.net/liostse/2tdtyL6d/

var tableData = [];
$.getJSON('http://88.99.13.199:3000/regionsdata', function(mydata) {
  mydata.forEach(function(val) {
    var regdata = {};
    regdata.measure_code = val.measure_code;
    regdata.totalbent = val.totalbent;
    regdata.totalddent = val.totalddent;
    regdata.totaldd = val.totaldd;
    regdata.pctpliromes = val.pctpliromes;
    tableData.push(regdata);
  });
});
$("#mytable").tabulator({
  data: tableData,
  layout: "fitColumns",
  tooltipsHeader: false,
  columns: 
    [{title: "Measure",field: "measure_code",sorter: "string",frozen: true},
    {title: "totalbent",field: "totalbent"},
    {title: "totalddent",field: "totalddent"},
    {title: "totaldd",field: "totaldd"},
    {title: "pctpliromes",field: "pctpliromes"}],
});

请注意,如果我使用硬编码数据,它会起作用:

var tableData = [
   {measure_code:"Μ1",totalbent:"", totalddent:"", totaldd:"", pctpliromes:""},
   {measure_code:"Μ2",totalbent:"", totalddent:"", totaldd:"", pctpliromes:""},
   {measure_code:"Μ3",totalbent:"", totalddent:"", totaldd:"", pctpliromes:""},
   {measure_code:"Μ19",totalbent:"", totalddent:"", totaldd:"", pctpliromes:""},
   {measure_code:"Μ20",totalbent:"", totalddent:"", totaldd:"", pctpliromes:""},
   {measure_code:"Μ97",totalbent:"", totalddent:"", totaldd:"", pctpliromes:""},
   ];

任何帮助都会很棒!

【问题讨论】:

    标签: javascript jquery json tabulator


    【解决方案1】:

    getJSON 是异步的,因此当您调用 .tabulator 时,您的数据还不存在。 您必须在 getJSON 成功函数中调用 .tabulator,例如:

    $.getJSON('http://88.99.13.199:3000/regionsdata', function(mydata) {
      mydata.forEach(function(val) {
        ...
      });
      $("#mytable").tabulator({
        ...
      });
    });
    

    【讨论】:

    • 如此明显!它在我的 jsfiddle 中不起作用,但在我的代码中运行良好!谢谢@ykouman(Σεευχαριστώ!Έχουμεσυνεργαστείστοπαρελθόν)。
    • Σε θυμάμαι πολύ καλά Ηλία! Καλή συνέχεια!
    【解决方案2】:

    无需在 Tabulator 之外解析您的数据,您可以调用 setData 函数并将您的 url 直接传递给该函数。 Tabulator 会处理剩下的事情。

    $("#mytable").tabulator("setData", "http://88.99.13.199:3000/regionsdata");

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-07-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-09-02
      相关资源
      最近更新 更多