表中未显示API数据。需要显示进度负荷(惰性负荷)。
在这里,我使用了制表器插件:



var url = "https://jsonplaceholder.typicode.com/todos/";
var myJsonString;
var table = new Tabulator("#example-table", {
    height:"311px",
    layout:"fitColumns",
    ajaxURL:"",
    ajaxResponse:function(url, params, response){
			 return table.setData(response);
    },
    ajaxProgressiveLoad:"scroll",
    paginationSize:20,
    placeholder:"No Data Set",
    columns:[
        {title:"Name", field:"userId", sorter:"string", width:200},
        {title:"Progress", field:"progress", sorter:"number", formatter:"progress"},
        {title:"Gender", field:"gender", sorter:"string"},
        {title:"Rating", field:"rating", formatter:"star", align:"center", width:100},
        {title:"Favourite Color", field:"col", sorter:"string"},
        {title:"Date Of Birth", field:"dob", sorter:"date", align:"center"},
        {title:"Driver", field:"car", align:"center", formatter:"tickCross", sorter:"boolean"},
    ],
});

**HTML tags are started here**
<link href="https://unpkg.com/tabulator-tables@4.4.1/dist/css/tabulator.min.css" rel="stylesheet"/>
<script src="https://unpkg.com/tabulator-tables@4.4.1/dist/js/tabulator.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="example-table"></div>

最佳答案

首先,您似乎没有在任何时候告诉表要使用哪个URL。

如果在创建制表器时未设置url,则在准备好将数据加载到表中时需要通过调用setData函数进行设置

table.setData("http://www.getmydata.com/now");


另外,您绝对不希望在ajaxResponse函数中执行任何操作,该操作旨在在接收到数据后处理数据,您的代码可能会导致无限循环,只需从代码中删除整个回调即可,而无需使用它。

制表器网站包含完整运行的Ajax Example

如果要逐步将数据加载到表中,即在用户滚动时分页响应并将其加载到表中,请查看Progressive Loading Documentation

10-05 20:34
查看更多