Handsontable 和单元格颜色答案

【问题标题】：Handsontable and cells colorsHandsontable 和单元格颜色
【发布时间】：2013-07-01 09:41:29
【问题描述】：

我有一个包含 2 行 3 个日期的 handsontable，当在非空单元格中插入新日期时，我想将颜色更改为绿色。

我的handsontable功能是

function startperspective() {

    $.getJSON("/Reporting/getperspective", function(data) {
        var reg = new RegExp('^((0[1-9]{1}|[12]{1}[0-9]{1}|3[01]{1})\/(0[1-9]{1}|1[012]{1})\/[0-9]{4}$)');
        if (data !== null) {
            $("#old_tab_handsontable").handsontable({
                data: data,
                colHeaders: ['Date Perspective', 'Date Archive', 'Date des valeurs finales'],
                columns: [
                    {data: 'datePers', type: 'date', dateFormat: 'dd/mm/yy'},
                    {data: 'dateArchive', type: 'date', dateFormat: 'dd/mm/yy'},
                    {data: 'dateDef', type: 'date', dateFormat: 'dd/mm/yy'}
                ],
                colWidths: [200, 200, 200],
                fillHandle: false,
                onBeforeChange: function(data) {
                    for (var ind = data.length - 1; ind >= 0; ind--) {
                        if ((!reg.test(data[ind][3]))) {
                            data[ind][3] = data[ind][2];
                            return false;
                        }
                        else {
                            if (data[ind][3] !== data[ind][2]) {
                                TabChange = true;
                                return true;
                            }
                        }
                    }
                }
            });
        }
}

TabChange 是一个布尔值，用于检查我是否有新的单元格用于保存。我想我需要在“onBeforeChange”中添加一些东西，但我不知道是什么。

我想避免更改 cellProperties，因为它会删除我的掌上电脑的日期选择器。

【问题讨论】：

你用的是哪个版本？

标签： javascript jquery handsontable

【解决方案1】：

如果我理解你是正确的，在发生变化之后，你想比较之前和之后的值，如果它从一个日期更改为另一个日期，那么你想将该单元格着色为绿色。

如果是这种情况，那么我会使用 afterChange

afterChange: function(changes, source){

    if (source=== 'loadData') {
        return; //don't do anything as this is called when table is loaded
    }
    var rowIndex = changes[0];
    var col = changes[1];
    var oldCellValue = changes[2];
    var newCellValue = changes[3];

    //compare oldCellValue with newCellValue to ensure it is the change you are after
    //you need to apply the logic you need but for example:
    if(oldCellValue !== newCellValue){
        //Here you set the background color to green
    }
}

您可能还想查看conditional formatting

【讨论】：