在 Handsontable 中移动列后编辑单元格时数据不正确

Question

我正在测试 handsontable 的 fiddles 之一，并在移动列时发现了问题。请转到以下 fiddle 并执行上述步骤。 http://jsfiddle.net/5u5vczcg/

var hot = new Handsontable(container, {
  data: financeData,
  colHeaders: ["Price", "Date", "1D Chg", "YTD Chg", "Vol BTC"],
  rowHeaders: true,
  stretchH: 'all',
  sortIndicator: true,
  columnSorting: true,
  contextMenu: true,
  manualColumnMove : true,
  columns: [
    {type: 'numeric', format: '[=10=],0.00'},
    {type: 'date', dateFormat: 'DD/MM/YYYY', correctFormat: true},
    {type: 'numeric', format: '0.00%'},
    {type: 'numeric', format: '0.00%'},
    {type: 'numeric', format: '0.00'}
  ]
});

将价格列移动到日期位置。双击任何价格单元格，您将看到单元格中的值仅为日期。此外，当您双击日期单元格时，它们也不会正确显示数据。能否请您检查并解决。

Answer 1

你面对的应该是一个相当古老的fixed issue。在几个 test/research 之后，如果我激活 manualColumnMove 选项，我的项目确实有相同的行为。

所以我向您建议的是从这两个解决方案中选择一个：

在他们的 git.
使用旧版本和我为您做的解决方法（版本 0.15.0） :

Your JS Fiddle uptaded

我想你可以从这里开始，了解如何定制你的 Handsontable。对于您的情况，我所做的是使用事件 'afterColumnMove' 更新两个修改后的列：

hot.addHook('afterColumnMove', function(sourceIndex, targetIndex) {
  var
  sourceValues = hot.getData(0,sourceIndex,hot.getData().length,sourceIndex),
  sourceProperties =hot.getSettings().columns[sourceIndex],
  sourceHeader=hot.getSettings().colHeaders[sourceIndex],
  targetValues = hot.getData(0,targetIndex,hot.getData().length,targetIndex),
  targetProperties =hot.getSettings().columns[targetIndex],
  targetHeader=hot.getSettings().colHeaders[targetIndex],

  newColumns=hot.getSettings().columns,
  newHeaders=hot.getSettings().colHeaders;

  newHeaders[sourceIndex]=targetHeader;
  newHeaders[targetIndex]=sourceHeader;
  newColumns[sourceIndex]=targetProperties;
  newColumns[targetIndex]=sourceProperties;

  hot.updateSettings({columns:newColumns,colHeaders:newHeaders});
  hot.populateFromArray(0,sourceIndex,sourceValues,hot.getData().length,sourceIndex);
  hot.populateFromArray(0,targetIndex,targetValues,hot.getData().length,targetIndex);
});

但是还有第三种选择：

用别的东西。根据您的预算，DataTables 的 Editor 版本是恕我直言，您可以使用的最好的东西，Handsontable 虽然看起来很漂亮，但在您尝试时包含许多剩余的错误编辑您的数据并使用其他功能。（这个问题就是一个完美的例子）。

在 Handsontable 中移动列后编辑单元格时数据不正确

Data is not correct while editing cells after moving columns in Handsontable

javascript

jquery

handsontable