可手动选择的Select2依赖下拉列表 [英] Handsontable Select2 Dependent Dropdowns

问题描述

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

I have two select2 dropdowns and I want to change options the second dropdown depending on first dropdown.

例如，

        {
          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来实现此目的，但是我无法弄清楚如何使用handontable来实现此功能.

Depending on country_id, I want to change select2 options of state_id. I know how to make this work with just select2, but I am not able to figure out how to make it work with handsontable.

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

I have change select2Options in afterChange, but how to do that?

  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?

            });
          }

        }

      },

推荐答案

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

You retrieve all the states for that country. Make sure the states list is in the same format that select2 expects.

然后循环浏览列列表，并确定已修改的当前列的从属列.

Then loop through the columns list and determine the dependent column for the current column that has been modified.

获取单元格属性:

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

更新select2源:

Update the select2 source:

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

这篇关于可手动选择的Select2依赖下拉列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！