Блог

Я использую нижний пользовательский расчет, поэтому bottomCalcFormatterParams его можно использовать в отношении документации

Вот код, который я использую

   title: "Sum",
  field: "cena_m",
  width: 100,
  topCalc: "sum",
  bottomCalc: mysum,
  bottomCalcParams: {
    precision: 0
  },
  bottomCalcFormatterParams: {
    decimal: ",",
    thousand: ".",
    symbol: "€",
    symbolAfter: "p",
    precision: false,
  },      
  formatter: "money",
  formatterParams: {
    decimal: ",",
    thousand: ".",
    symbol: "€",
    symbolAfter: "p",
    precision: 0,
  },
  topCalcFormatter: "money",
  topCalcFormatterParams: {
    decimal: ",",
    thousand: ".",
    symbol: "$",
    symbolAfter: "p",
    precision: false,
  },
}
 

Пожалуйста, обратите внимание, что вы должны щелкнуть строку, чтобы включить ее в пользовательский расчет. jsFiddle

Я нашел решение для табуляции. Я отсутствовал bottomCalcFormatter:"money", в настройках

Итак, это работает хорошо

   bottomCalcFormatter:"money",
  bottomCalcFormatterParams: {
    decimal: ",",
    thousand: ".",
    symbol: "€",
    symbolAfter: "p",
    precision: false,
  },  
 

Проверьте jsFiddle

 var tabledata = [{
    id: 1,
    name: "BO",
    cena: 31,
    mn: 1
  },
  {
    id: 2,
    name: "Xtend",
    cena: 23,
  },
  {
    id: 3,
    name: "Zinobiotic",
    cena: 24
  }
];

// copied from tabular source code and modified as required
// https://github.com/olifolkerd/tabulator/blob/master/src/js/modules/format.js
function sanitizeHTML(value) {
  if (value) {
    var entityMap = {
      'amp;': 'amp;amp;',
      '<': 'amp;<',
      '>': 'amp;>',
      '"': 'amp;quot;',
      "'": 'amp;#39;',
      '/': 'amp;#x2F;',
      '`': 'amp;#x60;',
      '=': 'amp;#x3D;'
    };

    return String(value).replace(/[amp;<>"'`=/]/g, function(s) {
      return entityMap[s];
    });
  } else {
    return value;
  }
}

function emptyToSpace(value) {
  return value === null || typeof value === "undefined" || value === "" ? "" : value;
}

function moneyFormatter(value, formatterParams) {
  var floatVal = parseFloat(value),
    number, integer, decimal, rgx;

  var decimalSym = formatterParams.decimal || ".";
  var thousandSym = formatterParams.thousand || ",";
  var symbol = formatterParams.symbol || "";
  var after = !!formatterParams.symbolAfter;
  var precision = typeof formatterParams.precision !== "undefined" ? formatterParams.precision : 2;

  if (isNaN(floatVal)) {
    return emptyToSpace(sanitizeHTML(value));
  }

  number = precision !== false ? floatVal.toFixed(precision) : floatVal;
  number = String(number).split(".");

  integer = number[0];
  decimal = number.length > 1 ? decimalSym   number[1] : "";

  rgx = /(d )(d{3})/;

  while (rgx.test(integer)) {
    integer = integer.replace(rgx, "$1"   thousandSym   "$2");
  }

  return after ? integer   decimal   symbol : symbol   integer   decimal;
}

var mysum = function(values, data, calcParams) {
  console.log(values, data, calcParams);
  var calc = 0;
  table amp;amp; values.forEach(function(value, index) {
    var row = table.getRow(index   1);
    var cell = row.getCell("name").getValue();

    if (row.isSelected() amp;amp; value) {
      calc = calc   value;
    }
  });
  if (calc == 0) {
    calc = ""
  }
  return moneyFormatter(calc, {
    decimal: ",",
    thousand: ".",
    symbol: "€",
    symbolAfter: "p",
    precision: false,
  });
}

function aktualizuj_m(cell) {
  var cena = cell.getRow().getCell("cena").getValue();
  var mnozstvi = cell.getValue();
  var rowIndex = cell.getRow().getIndex();
  if (typeof mnozstvi == "number") {
    cell.getRow().update({
      cena_m: cena * mnozstvi
    });
  }
}

var table = new Tabulator("#example-table", {
  movableColumns: true,
  data: tabledata,
  selectable: true,
  columns: [{
      title: "Name",
      field: "name",
      width: 200
    },
    {
      formatter: "rowSelection",
      titleFormatter: "rowSelection",
      hozAlign: "center",
      headerSort: false,
    },
    {
      title: "Cena",
      field: "cena",
    },
    {
      title: "mn",
      field: "mn",
      editor: "number",
      cellEdited: function(cell) {
        aktualizuj_m(cell);
      },
      cellClick: function(e, cell) {
        e.preventDefault();
        e.stopPropagation();
      },
    },
    {
      title: "Sum",
      field: "cena_m",
      width: 100,
      topCalc: "sum",
      bottomCalc: mysum,
      bottomCalcParams: {
        precision: 0
      },
      formatter: "money",
      formatterParams: {
        decimal: ",",
        thousand: ".",
        symbol: "€",
        symbolAfter: "p",
        precision: 0,
      },
      topCalcFormatter: "money",
      topCalcFormatterParams: {
        decimal: ",",
        thousand: ".",
        symbol: "$",
        symbolAfter: "p",
        precision: false,
      },
    }
  ],
  rowSelectionChanged: function(e, row) {
    this.recalc();
  },
  renderComplete: function() {
    this.getRows().forEach(function(value, index) {
      //console.log(index);
      aktualizuj_m(value.getCell("mn"));
    })
  }
});