时间戳

首页 > 解决方案 > KTDatatable (Metronic) 中的服务器端分页

javascript - KTDatatable (Metronic) 中的服务器端分页

问题描述

我是 Metronic 中 KTDatatable 的新手。

我正在尝试在 Metronic 仪表板中使用服务器端分页，并且我正在解析 KTDatatable 中的数据，但我找不到从 API 解析返回的数据并查看页面数和每个页面 URL 的方法。

到目前为止，我能够编写的代码是：

data: {
    type: 'remote',
    source: {
        read: {
            url: dataURL,
            method: 'GET',
            contentType: 'application/json',
            map: function(data) {
                var cards = data.cards.data;
                var currentPage = data.cards.current_page;
                var lastPage = data.cards.last_page;
                return cards;
            }
        },
    },
    pageSize: 10,
    serverPaging: true,
},

在这段代码中，我能够获得前十条记录，但是：

1-我无法在表格中按照我想要的方式解析它们。

2- 我无法显示页码，也无法调用我想要的第二页或 (x) 页的 API。

这些是我想做的事情。

提前致谢。

标签： javascriptphplaraveldatatablemetronic

解决方案

您可以返回到 KT-Datatable 文档的末尾找到您想要的 KT-Datatable 文档的大部分答案，但我会解释更多，希望它会更清楚。

所以 API (Json) 的返回值应该看起来有两个主要对象元和数据，它看起来像这样：

{
  "meta": {
    "sort": "desc",
    "field": "IssueName",
    "page": 1,
    "pages": 2,
    "perpage": "10",
    "total": 11
  },
  "data": [
    {
      "IssueName": "******",
      "CardNumber": "******"
    },
    {
      "IssueName": "******",
      "CardNumber": "******"
    }
  ]
}

从 API 获取响应的值后，您应该只返回要由数据表解析的数据对象，因此 map 函数应如下所示：

map: function(data) {
    return data.data;
}

它会自己处理元数据。

要将数据解析为列，您应该在列定义数组中使用数据的相同键名，因此在我的示例中，我像这样使用它：

columns: [
    {
        field: 'IssueName',
        title: columnsTitles.issue,
        type: 'string',
    },
    {
        field: 'CardNumber',
        title: columnsTitles.card_number,
        type: 'string',
    },
]

每次数据表调用 API 时，它都会发送更多数据来帮助您做出正确的响应，数据将采用数组的形式（字段名称应与键相同）：

[
    "pagination" => array:4 [
        "page" => "1"
        "pages" => "2"
        "perpage" => "10"
        "total" => "11"
    ],
    "sort" => array:2 [
        "field" => "IssueName"
        "sort" => "desc"
    ],
]

发送的数据与你必须从API获取的分页和排序类型有关，你也可以添加过滤器，它们将存储在“查询”字段的数组中，你可以在后端处理它们。

推荐阅读