我有一个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,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],autoWrapRow: true,autoWrapCol: true,beforeRemoveRow: removerow_validation });
我有一个复选框.当我点击复选框时,应将“到期”(第4列)的值填充到“已接收”(列).如果我取消选中它,那么Received应为空白,这与表onload相同.
我的工作如下:
$("#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列.但是如果我从第5列编辑任何单元格,那么除了编辑单元格之外的整个列都会刷新,第5列变为空白.
我怎么能避免它.
请参考图片了解详细信息:
如何在编辑后避免刷新单元格?
解决方法
出现问题是因为我需要在将行值更改为另一行后更新数据数组.当我更改内容时,它仅在屏幕上更改.当我编辑单元格时,它将调用渲染函数,它将采用旧的数据数组,这就是为什么它显示没有值的列.
这是我的解决方案:
如果:
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 });