Question

我使用handontable表并且其中有5列， manualColumnMove true ，因此用户可以移动列。

但我想在前两列中禁用此功能，我该怎么做？

Answer 1

一种方法是阻止在beforeColumnMove中移动列，例如：

function setBeforeColumnMove() {
    return function(startColumn, endColumn) {
        var manualColumnMove = this.getPlugin("ManualColumnMove");

        if(startColumn < 2 || endColumn < 2) {
            manualColumnMove.changeColumnPositions(endColumn, startColumn);
        }
    }
};

看一下这个例子：JSFiddle

祝你好运;）

Answer 2

在动手0.34.0中，可以通过从beforeColumnMove hook/callback返回false来阻止行或列移动。

我已相应地调整了Joakim Si Ali的小提琴：

document.addEventListener("DOMContentLoaded", function() {

  var
    data1 = [
      ['', 'Kia', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'],
      ['2012', 10, 11, 12, 13, 15, 16],
      ['2013', 10, 11, 12, 13, 15, 16],
      ['2014', 10, 11, 12, 13, 15, 16],
      ['2015', 10, 11, 12, 13, 15, 16],
      ['2016', 10, 11, 12, 13, 15, 16]
    ],
    container1 = document.getElementById('example1'),
    settings1 = {
      data: data1,
      manualColumnMove: true,
      beforeColumnMove: beforeColumnMove(),
      colHeaders: true,
    },
    hot1;

  hot1 = new Handsontable(container1, settings1);

  function beforeColumnMove() {
    return function(columnsMoving, target) {
      if (columnsMoving[0] < 2 || target < 2) {
        return false;
      }
      return true;
    }
  };
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/handsontable/0.34.0/handsontable.full.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/handsontable/0.34.0/handsontable.full.min.js"></script>
<div id="example1" class="hot handsontable"></div>

禁用前两列移动

2 个答案: