Handsontable - 根据单元格值

Question

其中一列在我的handsontable定制渲染器有以下要求：不同的基础上，是不是表的一部分值

设置单元格颜色。以下是完整的代码 -

http://jsfiddle.net/3b1nc46b/

var objectData = [ 
    {id: 1, name: "Ted Right", address: "NY", value:{old_value:"10", new_value:"15"}}, 
    {id: 2, name: "Frank Honest", address: "CA", value:{old_value:"12", new_value:"12"}}, 
    {id: 3, name: "Joan Well", address: "TX", value:{old_value:"20", new_value:"28"}} 

];

var valueRenderer = function (instance, td, row, col, prop, value, cellProperties) { 
var background_color = ''; 
if (value.old_value == value.new_value) { 
    background_color = 'white'; 
} else { 
    background_color = 'yellow'; 
} 
value = value.new_value; 
Handsontable.renderers.NumericRenderer.apply(this, arguments); 
$(td).css({ 
    background: background_color 
}); 

};

如果old_value不等于new_value，那么在这个“Value”列中需要着黄色，否则背景应该是白色的。首先，我将new_value和old_value放置在数据源中嵌套的“值”项中。这工作，但它造成的其他问题：

1. 当您单击编辑细胞时，它显示“[对象的对象]”，而不是价值 - 这是有道理的，因为我已经在通过“价值”列清单，而不是
2. 背景颜色不保留到解决这个问题将有一个包含OLD_VALUE隐藏列，并用它来比较和设置

单向“value.new_value”渲染器。但是，如果表格有10列或更多，并且如果每列都需要根据上述条件进行着色，则会很快变得太大（在保存功能期间也需要特殊处理）

什么是最好的如何做到这一点？

Answer 1

除了自定义渲染器之外，还需要设置自定义编辑器。

然后，在您的自定义渲染器和编辑器中，您可以控制“保留”逻辑或更改背景颜色。

我刚刚在这里回答了一个相关问题：Binding Handsontable cells to complex objects。该示例不使用数字渲染器作为基础，因此您可以完全控制dom元素。

我相信答案和问题中引用的许多文档都有帮助。

最后，documentation here示例中的“渲染自定义HTML标头”一节中的示例似乎也与您的问题有一些重叠。