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];

Handsontable Select2 相关下拉菜单

Handsontable Select2 Dependent Dropdowns

jquery-select2

handsontable