时间戳

首页 > 解决方案 > 有没有办法使用ajax在制表器中将第一行设置为列标题？

tabulator - 有没有办法使用ajax在制表器中将第一行设置为列标题？

问题描述

我正在使用制表器Tabulator使用 ajax 加载表。

var table = new Tabulator("#example-table", {
    ajaxURL:"http://www.getmydata.com/now", //ajax URL 
    autoColumns: true,
});

它可以完美加载，但不会将第一行加载为列标题。我需要将 autoColumns 设置为 true，因为 ajax 响应是动态的并且列会发生变化。但是，第一行始终是列标题。制表器没有选择第一行作为标题。

我找不到将第一行设置为标题的相关配置。

桌子

标签： tabulator

解决方案

如果您使用该autocolumns选项，制表器将从第一行的数据属性名称中提取列名，而不是从第一行的字符串数组中提取。

例如，使用以下数据：

 var tabledata = [
    {id:1, name:"Oli Bob", age:"12", col:"red", dob:""},
    {id:2, name:"Mary May", age:"1", col:"blue", dob:"14/05/1982"},
    {id:3, name:"Christine Lobowski", age:"42", col:"green", dob:"22/05/1982"},
    {id:4, name:"Brendon Philips", age:"125", col:"orange", dob:"01/08/1980"},
    {id:5, name:"Margret Marmajuke", age:"16", col:"yellow", dob:"31/01/1999"},
 ];

你最终会得到 4 列标题为“name”、“age”、“col”和“dob”。

无论您打算如何使用它，都必须始终以这种对象数组格式向 Tabulator 提供数据。

如果您的服务器无法提供这种格式的数据，那么您可以使用ajaxResponse回调从服务器获取传入数据，重新格式化它，然后以 Tabulator 期望的格式从函数中返回它：

var table = new Tabulator("#example-table", {
    ajaxResponse:function(url, params, response){
        //url - the URL of the request
        //params - the parameters passed with the request
        //response - the JSON object returned in the body of the response.

        return response.tableData; //return the tableData property of a response json object
    },
});

可以在 [Ajax 文档[(http://tabulator.info/docs/4.9/data#ajax)

推荐阅读