Handsontable Select2 相关下拉列表

Question

我有两个 select2 下拉菜单，我想根据第一个下拉菜单更改第二个下拉菜单的选项。

例如，

        {
          data: 'country_id',
          editor: 'select2', 
          renderer: customDropdownRenderer,
          select2Options: { 
                  data: {!! $production_units !!} ,
                  dropdownAutoWidth: true,
          }
        },
        {
          data: 'state_id',
          editor: 'select2', 
          renderer: customDropdownRenderer,
          select2Options: { 
                  data: [],
                  dropdownAutoWidth: true,
                  width: 'resolve'
          }
        },

根据 country_id，我想更改 state_id 的 select2 选项。我知道如何仅使用 select2 来完成这项工作，但我无法弄清楚如何使其与 handsontable 一起工作。

我在 afterChange 中更改了 select2Options，但是该怎么做呢？

  afterChange: function (change, source) {

        if(change)
        {

          if(change[0][1] == 'country_id')
          {
            $.get("/api/states?country="+change[0][3], function(data){

                 //What should be done here?

            });
          }

        }

      },

Answer 1

您检索该国家/地区的所有州。确保状态列表的格式与 select2 期望的格式相同。

然后循环遍历列列表，确定当前已修改列的依赖列。

获取单元格属性：

var cellProperties = instance.getCellMeta(rowIndex, dependentColumnIndex);

更新 select2 源：

cellProperties['select2Options'].data = [states list];