javascript - 制作启用/禁用组合框 ExtJS 的函数

Question

我在 Ext JS 中有以下表单组件，这两个组件是组合框，需要在选择第一个组合框(type_sector)时启用第二个组合框(main_sector)。

{
                xtype: 'combobox',
                name: 'type_sector',
                fieldLabel: 'Setor',
                displayField: 'name',
                valueField: 'id',
                labelAlign: 'top',
                flex: 1,
                margin: { left: 3 },
                store: 'EconomicActivityType',
                width: 80,
                editable: false,
                queryMode: 'local',
            },
            {
                xtype: 'combobox',
                name: 'main_sector',
                fieldLabel: 'Principal',
                displayField: 'name',
                valueField: 'id',
                labelAlign: 'top',
                margin: { left: 3},
                store: 'EconomicActivityType',
                inputWidth: 200,
                editable: true,
                queryMode: 'local',
            }

我想构建一个函数，如果每个示例组合框值(type_sector)等于 x，则启用组合框(main_sector)，否则它被隐藏/禁用。我如何在 Ext JS 的表单中执行此操作？

我正在尝试这样做:

{
                    xtype: 'combobox',
                    name: 'type_sector',
                    fieldLabel: 'Setor',
                    displayField: 'name',
                    valueField: 'id',
                    labelAlign: 'top',
                    flex: 1,
                    margin: { left: 3 },
                    store: 'EconomicActivityType',
                    width: 80,
                    editable: false,
                    queryMode: 'local',
                    id: "type_sector_combo",
                    listeners:{select:{fn:function() {
                                if (this.getComponent('type_sector_combo').value == "sector"){
                                    this.getComponent('main_sector_combo').disable = false;
                                }
                            }}}
                },
                {
                    xtype: 'combobox',
                    name: 'main_sector',
                    fieldLabel: 'Principal',
                    displayField: 'name',
                    valueField: 'id',
                    labelAlign: 'top',
                    margin: { left: 3},
                    store: 'EconomicActivityType',
                    inputWidth: 120,
                    editable: true,
                    queryMode: 'local',
                    id: "main_sector_combo",
                    disabled: true
                }

Answer 1

在 type_sector 组合上为选择事件创建监听器 https://docs.sencha.com/extjs/6.2.0/classic/Ext.form.field.ComboBox.html#event-select然后在其中使用 setDisabled 方法 https://docs.sencha.com/extjs/6.2.0/classic/Ext.form.field.ComboBox.html#placeholder-setDisabled设置 main_sector 组合的状态