javascript - Handsontable 中的级联下拉菜单

Question

我正在尝试创建一个下拉类型列，而条件由另一个单元格的内容确定。

列设置是由函数构建的，当它应该是级联下拉列表时，源也是一个函数。

一切工作正常，当您双击单元格时，该函数就会被调用。该函数正在运行并返回正确的数组。但下拉菜单打不开。

JS 的简短版本:

data: Object.keys(data[0])[i],
type: "dropdown",
source: function getDropdownList() {
          // function build the array
          return dropdownOptions;
        }

长版JS:

var myData = Handsontable.helper.createSpreadsheetData(5, 5);
var container = document.getElementById('table1');
var settings1 = {
   data: myData,
   columns: buildTypeObject()
}

var table1 = new Handsontable(container, settings1);

function buildTypeObject() {
  var typeObject = [];
  for (var i = 0; i < myData.length; i++) {
    if (i=1) {
        typeObject[i] = {
            data: ("column " + i),
            type: "dropdown",
            source: function getDropdownList() {
                var dropdownOptions = [];
                var selectedRow = table1.getSelected()[0];
                var selectedColumn = table1.getSelected()[1];
                var previousCell = table1.getDataAtCell(selectedRow, selectedColumn-1);
                if (previousCell == "A1") {
                    dropdownOptions = ["AB1","BB1"];
                } else {
                    dropdownOptions = ["ZZ1", "ZZ2", "ZZ3", "ZZ4"];                        
                }
                console.log(dropdownOptions);
                return dropdownOptions;            
            }
        }                
    } else {
        typeObject[i] = {
            data: ("column " + i) 
        }            
    }
 };
 return typeObject;
};

Answer 1

我已经设法使用 setCellMeta(row, col, key, value) 方法解决了这个问题。

现在 JS 看起来像这样:

var myData = Handsontable.helper.createSpreadsheetData(5, 5);
var container = document.getElementById('table1');
var settings1 = {
   data: myData,
   columns: buildTypeObject()
}

var table1 = new Handsontable(container, settings1);

function buildTypeObject() {
  var typeObject = [];
  for (var i = 0; i < myData.length; i++) {
    if (i=1) {
        typeObject[i] = {
            data: ("column " + i),
            type: "dropdown",
            source: function getDropdownList() {
                var dropdownOptions = [];
                var selectedRow = table1.getSelected()[0];
                var selectedColumn = table1.getSelected()[1];
                var previousCell = table1.getDataAtCell(selectedRow, selectedColumn-1);
                if (previousCell == "A1") {
                    dropdownOptions = ["AB1","BB1"];
                } else {
                    dropdownOptions = ["ZZ1", "ZZ2", "ZZ3", "ZZ4"];                        
                }
                console.log(dropdownOptions);
                //return dropdownOptions;
                setCellMeta(selectedRow, selectedCol, "source", dropdownOptions);            
            }
        }                
    } else {
        typeObject[i] = {
            data: ("column " + i) 
        }            
    }

唯一的问题是下拉列表在第一次单击时不会打开，但在第二次单击或编辑单元格时会打开(输入任何字符或删除)