在handsontable中禁用前两列移动

Posted 2023-03-22

【中文标题】在handsontable中禁用前两列移动

【英文标题】：Disable first two column move in handsontable

【发布时间】：2017-01-17 19:59:42

【问题描述】：

我使用handsontable table，里面有5列，ma​​nualColumnMove是true，所以用户可以移动列。

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

【参考方案1】：

在handsontable 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】：

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

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

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

看这个例子：JSFiddle

祝你好运；）