cell.style.backgroundColor 会导致样式错误(WJM-30757)
本帖最后由 Richard.Ma 于 2023-9-11 14:17 编辑根据限制条件，应该只有'salesDiff' he 'expensesDiff'
两列会改变背景颜色，然而移动滚动条之后发现，会随机出现改变背景颜色的列。
就是官网这个例子，我增加了一些列，让列数量超出显示宽度后，会出现这个问题。
是想根据条件动态渲染单元格背景色和文字颜色，并且导出excel后，颜色样式可以保留。
您好，请参考以下链接的示例解决这个问题
https://jscodemine.grapecity.com/sample/IPu05aWqXEm2UA-279Ve_w/
关键代码
// custom rendering for "Diff" columns
if (e.panel == s.cells) {
var col = s.columns;
if (e.row > 0 && (col.binding == 'salesDiff' || col.binding == 'expensesDiff')) {
var vnow = s.getCellData(e.row, e.col - 1), vprev = s.getCellData(e.row - 1, e.col - 1), diff = (vnow / vprev) - 1;
console.log(e.col,s.columns);
// Only apply background color to "Diff" columns
if (col.binding == 'salesDiff' || col.binding == 'expensesDiff') {
e.cell.style.backgroundColor = "#FF7452";
}
// format the cell
var html = '<div class="diff-{cls}">' +
'<span style="font-size:75%">{val}</span> ' +
'<span style="font-size:120%" class="wj-glyph-{glyph}"></span>';
html = html.replace('{val}', Globalize.format(diff, col.format));
if (diff < 0.01) {
html = html.replace('{cls}', 'down').replace('{glyph}', 'down');
}
else if (diff > 0.01) {
html = html.replace('{cls}', 'up').replace('{glyph}', 'up');
}
else {
html = html.replace('{cls}', 'none').replace('{glyph}', 'circle');
}
e.cell.innerHTML = html;
} else {
// Clear background color for non-"Diff" columns
e.cell.style.backgroundColor = '';
}
}
}); 是的，官网示例中，这个grid绑定了数据源，限制条件是根据这两列绑定的字段名称来限制的，
我不知道你说的“增加了一些列，让列数量超出显示宽度”是怎么操作的，也就说我怎么重现你的问题呢？麻烦给出详细的步骤 Richard.Ma 发表于 2023-5-4 11:05
是的，官网示例中，这个grid绑定了数据源，限制条件是根据这两列绑定的字段名称来限制的，
我不知道你说 ...
官网示例中，这样随意增加一些列，作用是为了可以出现横向滚动条，横向滚动触发视图渲染。
数据生成中，也是同理：
之后，增加修改单元格背景颜色的代码：
根据条件：
if (e.row > 0 && (col.binding == 'salesDiff' || col.binding == 'expensesDiff'))
应 只有salesDiff / expensesDiff两列背景色被改变
但 移动横向滚动条，其他列会随机出现背景色被改变的现象。
问题可以重现，看起来可能是重绘时的bug，目前想不到什么解决办法
此问题我作为bug提交研发，帖子暂时保留处理 这个问题处理了吗？ Richard.Ma 发表于 2023-5-4 18:07
问题可以重现，看起来可能是重绘时的bug，目前想不到什么解决办法
此问题我作为bug提交研发，帖子暂时保 ...
这个问题处理了吗？ 您好，此bug仍在调研修复，有新的进展我会在帖子后面回复更新
页:
[1]