Tree Template

The first column of the tree was restricted from using the HTML renderer, but with the 2.8.9 update, you can set the data area of the first column to display HTML via templateOption (opens in a new tab).

The example below shows an example of displaying the trial code in a different color in the first column.

treeView.treeOptions.templateOptions = {
  callback: (tree, model, width, height) => {
    if (model.item && model.item.level > 0) {
      let code = `area${model.item.level}code`; let name = `area${model.item.level}name`;
      code = tree.getValue(model.index?.itemIndex, code);
      name = tree.getValue(model.index?.itemIndex, name);
      return `<span style='color:red'>[${code}]</span> <span style='color:blue'>${name}</span>`;
    }
    return model.value;
  }
}

Tree icon2 Tree event