Tabulator ，有没有办法将页面总和添加到页脚？

Question

Tabulator 有一个名为 Column Calculations.

的模块

我需要同时添加 sum of page 和 sum of total

例如，我可以为计算 sum of total 添加页脚，但我不能同时添加 sum of visible rows 或换句话说 sum of current page only。

我可以向 table 的 bottom 或 top 添加页脚：topCalc& bottomCalc .

例如我可以添加 sum of price.

正如您在下面的示例中看到的，我在此处添加了总价格。

另外我把例子放在这里：https://jsfiddle.net/o2ycm5dp/

function generateTable(data) {
  tableInstance = new Tabulator("#simpleTable", {
    layout: "fitColumns",
    resizableColumns: false,
    selectable: false,
    paginationSize: 3,
    responsiveLayout: "hide",
    ajaxFiltering: false,
    pagination: "local",
    columns: [{
        title: "name",
        field: "name",
      },
      {
        title: "price",
        field: "price",
        bottomCalc: "sum",
      },

    ],
  });
  tableInstance.setData(data);
}

$(document).ready(function() {
  var data =     [{
    name: "Tiger Nixon",
    price: "320800"
}, {
    name: "Garrett Winters",
    price: "170750"
}, {
    name: "Ashton Cox",
    price: "86000"
}, {
    name: "Cedric Kelly",
    price: "433060"
}, {
    name: "Airi Satou",
    price: "162700"
}, {
    name: "Brielle Williamson",
    price: "372000"
}, {
    name: "Herrod Chandler",
    price: "137500"
}];
  generateTable(data);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://unpkg.com/tabulator-tables@4.5.3/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables@4.5.3/dist/js/tabulator.min.js"></script>
<div id="simpleTable"></div>

这一行：bottomCalc: "sum",，会调用计算函数，我们可以看到price列的sum。

有一个名为Custom Calculations的选项，我可以添加一个函数只计算current page values，但我不能计算total pages values。

另一个解决方案可能是 append 页脚的 html 元素，但我认为这不是一个好的解决方案。因为我应该处理所有与 Tabulator 页脚相关的功能。

Answer 1

Tabulator 无法按您的要求布置 table。您需要手动创建一个页脚元素来处理此问题，然后使用 Pagination Callbacks 计算出要显示的值

Tabulator ，有没有办法将页面总和添加到页脚？

Tabulator , Is there a way of adding sum of page to the footer?

javascript

jquery

tabulator