我有Handsontable
如下:
ordertable = new Handsontable(container, {
data: data,
colHeaders: ['Customer', 'Mode', 'Remarks', 'Due', 'Recieved'],
columns: [{
data: 2,
readOnly: true
}, {
data: 6,
type: 'autocomplete',
source: collectionmethod,
validator: collectionmethod_validations,
strict: true
}, {
data: 5,
readOnly: false
}, {
data: 4,
readOnly: true,
type: 'numeric',
format: '0.00'
}, {
data: 3,
type: 'numeric',
format: '0.00',
validator: amt_validations,
allowInvalid: true
}],
minSpareRows: 0,
rowHeaders: true,
contextMenu: ['row_above', 'row_below', 'remove_row', 'undo', 'redo'],
colWidths: [150, 100, rest, 100, 100],
autoWrapRow: true,
autoWrapCol: true,
beforeRemoveRow: removerow_validation
});
我有一个复选框。当我点击复选框时,Due
(第4列)的值应填入“收到的”列(列)。如果我取消选中它,那么Received
应该是空白的,这与表格上载相同。
我的工作如下:
$("#sel_prefill").click(function() {
if ($("#sel_prefill:checked").val()) {
var g = $('.htCore').find('tbody tr td:nth-child(5)'); //Due
var f = $('.htCore').find('tbody tr td:nth-child(6)') // Recieved
g.each(function(i, v) {
f.eq(i).text(g.eq(i).text());
$(v).css({
'text-align': 'right'
});
});
} else {
var g = $('.htCore').find('tbody tr td:nth-child(5)'); //Due
var f = $('.htCore').find('tbody tr td:nth-child(6)') // Recieved
g.each(function(i, v) {
f.eq(i).text("");
//$container.handsontable('setDataAtCell', 1, 4, 5);
$(v).css({
'text-align': 'right'
});
});
}
});
工作正常。
但问题是在检查了checbox之后,该列的值被填充到第5列。但是if I edit any cell from 5th column, then the entire column except editted cell gets refreshed and 5th column becomes blank.
。
我该如何避免它。
请参考图片了解详细信息:
如何在编辑后避免刷新单元格?
答案 0 :(得分:0)
出现问题是因为我需要在将行值更改为另一行后更新数据数组。当我更改内容时,它仅在屏幕上更改。当我编辑单元格时,它将调用渲染函数,它将采用旧的数据数组,这就是为什么它显示没有值的列。
这是我的解决方案:
如果:
g.each(function(i, v) {
f.eq(i).text(g.eq(i).text());
data[i][3] = g.eq(i).text(); //Need to update the array also
});
在其他地方:
g.each(function(i, v) {
f.eq(i).text("");
data[i][3] = ""; //Need to update the array also
});