本文介绍了来自行值的总和，“2 列"最大手持台的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个需要对 cols 求和的 handsontable，最后 col 对所有 cols 求和我可以总结所有的 cols，问题是 cols 是动态的，有时 one-col 有一个孩子，在这种情况下，我需要对两者的最大值求和，但我不知道我该怎么做，!when 只是一个只是总结一个.如果有一个子和只是两个列的最大值.
例如:work1 是父级.孩子是 help 1，数组 cols 来自数据库
示例
function hexRenderer(instance, td, row, col, prop, value, cellProperties) {Handsontable.TextCell.renderer.apply(this, arguments);}var hot = new Handsontable($("#exampleGrid")[0], {数据: [[0, 0, 0, 0],[0, 0, 0, 0]],填充句柄:假，minSpareCols: 0,minSpareRows: 0,列: [{数据:'work.name'，title: '姓名',只读:真，类型:'数字'，宽度:100}, {数据:'work.1'，perent: "1",标题:'工作1'，类型:'数字'，宽度:50}, {数据:'work.2'，perent: "1|h",title: '帮助 1',类型:'数字'，宽度:50}, {数据:'work.3'，perent: "3",标题:'工作2'，类型:'数字'，宽度:50}, {数据:'work.4'，perent: "3|h",标题:'帮助2'，类型:'数字'，宽度:50}, {数据:'work.5'，perent: "5",title: '工作 3',类型:'数字'，宽度:50}, {数据:'work.6'，perent: "6",title: '工作 4',类型:'数字'，宽度:50}, {数据:'work.7'，perent: "6|h",title: '帮助 4',类型:'数字'，宽度:50}, {数据:'总计'，title: '总计',只读:真，宽度:100，类型: {渲染器:函数(实例，td，行){让 cols = instance.countCols() - 1;让总数 = 0;for (let index = 1; index < cols; index++) {总计 += instance.getDataAtCell(row, index);}td.innerHTML = 总数；}}}],afterChange:函数(变化，源){console.log("保存数据的过程")}});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><link rel="stylesheet" type="text/css" href="http://handsontable.com/demo/css/samples.css"><script type="text/javascript" src="http://handsontable.com/dist/handsontable.full.js"></script><link rel="stylesheet" type="text/css" href="http://handsontable.com/dist/handsontable.full.css"><div id="exampleGrid" class="dataTable"></div> 解决方案
我通过更改数据键来修复它，以便轻松识别哪个列是父列，哪个列是子列，如下所示.
function hexRenderer(instance, td, row, col, prop, value, cellProperties) {Handsontable.TextCell.renderer.apply(this, arguments);}var hot = new Handsontable($("#exampleGrid")[0], {数据: [[0, 0, 0, 0],[0, 0, 0, 0]],填充句柄:假，minSpareCols: 0,minSpareRows: 0,列: [{数据:'work.name'，title: '姓名',只读:真，类型:'数字'，宽度:100}, {数据:'work.1'，perent: "1",标题:'工作1'，类型:'数字'，宽度:50}, {数据:'help.1'，perent: "1|h",title: '帮助 1',类型:'数字'，宽度:50}, {数据:'work.2'，perent: "3",标题:'工作2'，类型:'数字'，宽度:50}, {数据:'help.2'，perent: "3|h",标题:'帮助2'，类型:'数字'，宽度:50}, {数据:'work.3'，perent: "5",title: '工作 3',类型:'数字'，宽度:50}, {数据:'work.4'，perent: "6",title: '工作 4',类型:'数字'，宽度:50}, {数据:'help.4'，perent: "6|h",title: '帮助 4',类型:'数字'，宽度:50}, {数据:'总计'，title: '总计',只读:真，宽度:100，类型: {渲染器:函数(实例，td，行){const cols = instance.getCellMetaAtRow(row);cols.shift();const 值 = cols.reduce((acc, ele) => {const [type, ind] = ele.prop.split('.');const value = instance.getDataAtCell(row, ele.col);if (value && (!acc[ind] || value > acc[ind])) {acc[ind] = 值；}返回acc；}, {});td.innerHTML = Object.values(values).reduce((acc, e1) => acc + e1, 0);}}}],afterChange:函数(变化，源){//console.log("保存数据的过程")}});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><link rel="stylesheet" type="text/css" href="http://handsontable.com/demo/css/samples.css"><script type="text/javascript" src="http://handsontable.com/dist/handsontable.full.js"></script><link rel="stylesheet" type="text/css" href="http://handsontable.com/dist/handsontable.full.css"><div id="exampleGrid" class="dataTable"></div>I have a handsontable where I need to sum cols, the end col has total from all cols summedI can sum all cols, the problem is cols is dynamics sometimes one-col has a child, in this case, I need to sum the max of both, but I don't know how can I do it, !when is just one just sum one. if has a child sum just the max both cols.!
ex: work1 is the parent. the child is help 1, the arrays cols came from database
example http://jsfiddle.net/duxL728h/
function hexRenderer(instance, td, row, col, prop, value, cellProperties) {
Handsontable.TextCell.renderer.apply(this, arguments);
}
var hot = new Handsontable($("#exampleGrid")[0], {
data: [
[0, 0, 0, 0],
[0, 0, 0, 0]
],
fillHandle: false,
minSpareCols: 0,
minSpareRows: 0,
columns: [{
data: 'work.name',
title: 'Name',
readOnly: true,
type: 'numeric',
width: 100
}, {
data: 'work.1',
perent: "1",
title: 'work 1',
type: 'numeric',
width: 50
}, {
data: 'work.2',
perent: "1|h",
title: 'help 1',
type: 'numeric',
width: 50
}, {
data: 'work.3',
perent: "3",
title: 'work 2',
type: 'numeric',
width: 50
}, {
data: 'work.4',
perent: "3|h",
title: 'help 2',
type: 'numeric',
width: 50
}, {
data: 'work.5',
perent: "5",
title: 'work 3',
type: 'numeric',
width: 50
}, {
data: 'work.6',
perent: "6",
title: 'work 4',
type: 'numeric',
width: 50
}, {
data: 'work.7',
perent: "6|h",
title: 'help 4',
type: 'numeric',
width: 50
}, {
data: 'total',
title: 'Total',
readOnly: true,
width: 100,
type: {
renderer: function(instance, td, row) {
let cols = instance.countCols() - 1;
let total = 0;
for (let index = 1; index < cols; index++) {
total += instance.getDataAtCell(row, index);
}
td.innerHTML = total;
}
}
}
],
afterChange: function(changes, source) {
console.log("proces to save data")
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://handsontable.com/demo/css/samples.css">
<script type="text/javascript" src="http://handsontable.com/dist/handsontable.full.js"></script>
<link rel="stylesheet" type="text/css" href="http://handsontable.com/dist/handsontable.full.css">
<div id="exampleGrid" class="dataTable"></div> 解决方案
I fixed it by changing data keys, to easily recognize which col is parent and which col is it's child like below.
function hexRenderer(instance, td, row, col, prop, value, cellProperties) {
Handsontable.TextCell.renderer.apply(this, arguments);
}
var hot = new Handsontable($("#exampleGrid")[0], {
data: [
[0, 0, 0, 0],
[0, 0, 0, 0]
],
fillHandle: false,
minSpareCols: 0,
minSpareRows: 0,
columns: [{
data: 'work.name',
title: 'Name',
readOnly: true,
type: 'numeric',
width: 100
}, {
data: 'work.1',
perent: "1",
title: 'work 1',
type: 'numeric',
width: 50
}, {
data: 'help.1',
perent: "1|h",
title: 'help 1',
type: 'numeric',
width: 50
}, {
data: 'work.2',
perent: "3",
title: 'work 2',
type: 'numeric',
width: 50
}, {
data: 'help.2',
perent: "3|h",
title: 'help 2',
type: 'numeric',
width: 50
}, {
data: 'work.3',
perent: "5",
title: 'work 3',
type: 'numeric',
width: 50
}, {
data: 'work.4',
perent: "6",
title: 'work 4',
type: 'numeric',
width: 50
}, {
data: 'help.4',
perent: "6|h",
title: 'help 4',
type: 'numeric',
width: 50
}, {
data: 'total',
title: 'Total',
readOnly: true,
width: 100,
type: {
renderer: function(instance, td, row) {
const cols = instance.getCellMetaAtRow(row);
cols.shift();
const values = cols.reduce((acc, ele) => {
const [type, ind] = ele.prop.split('.');
const value = instance.getDataAtCell(row, ele.col);
if (value && (!acc[ind] || value > acc[ind])) {
acc[ind] = value;
}
return acc;
}, {});
td.innerHTML = Object.values(values).reduce((acc, e1) => acc + e1, 0);
}
}
}
],
afterChange: function(changes, source) {
// console.log("proces to save data")
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://handsontable.com/demo/css/samples.css">
<script type="text/javascript" src="http://handsontable.com/dist/handsontable.full.js"></script>
<link rel="stylesheet" type="text/css" href="http://handsontable.com/dist/handsontable.full.css">
<div id="exampleGrid" class="dataTable"></div>这篇关于来自行值的总和，“2 列"最大手持台的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！