handsOnTable单元格着色 [英] handsOnTable cell coloring

问题描述

我有一个Handsontable表，里面已经填充了数据并且已经渲染

I have a Handsontable table filled with data and already rendered

在检查了单元格之后，我找到了几个感兴趣的单元格，并想给它们上色-是否有使用Handsontable代码执行此操作的好方法?

After checking the cells, I have located a couple of cells of interest and would like to color them - is there a good way to do this using the Handsontable code?

请注意，这是在加载并渲染表格之后

Please note this is after loading and rendering the table

该表具有以下基本选项:

The table is rendered with basic options:

$container.handsontable({
    startRows: 8,
    startCols: 6,
    rowHeaders: true,
    colHeaders: true,
    minSpareRows: 1,
    minSpareCols: 1,
    //contextMenu: false,
    cells: function (row, col, prop) {
    }
  });

然后通过Ajax加载数据，decode_file.php读取一个Excel工作表并以JSON形式返回数据:

And the data is loaded via Ajax, decode_file.php reads an excel sheet and returns data as JSON:

  $.ajax({
      url: "decode_file.php",
      type: 'GET',
      success: function (res) {
        handsontable.loadData(res.data);
        console.log('Data loaded');
      },
      error: function (res) {
        console.log("Error : " + res.code);
      }
    });

加载数据后，用户单击处理"按钮，代码将查找带有文本"Hello world"的单元格.假设代码在单元格行4/列5 中找到了文本"Hello World"，并将单元格行4/列5 的背景色更改为红色

After loading the data, the user clicks a "Process" button and the code looks for a cell with the text "Hello world". Let's say the code finds the text "Hello World" in cell row 4/col 5 and changed the background color of cell row 4/col 5 to red

推荐答案

主页为您提供了一个很好的示例:

The homepage provides a good example for your purpose:

http://handsontable.com/demo/renderers.html

只需修改条件(在本例中为上/左角)即可.

Just modify the condition (in this case upper/left corner).

cells: function (row, col, prop) {
  if (row === 0 && col === 0) {
    return {type: {renderer: greenRenderer}};
  }
}

您完成了.

这篇关于handsOnTable单元格着色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！