如何禁用基于 viewModel store returnrd data extjs 的组件

Question

我有两个组合框，我希望根据从组合框 A 中选择的值禁用组合框 (b)（我应该查看其存储数据以查找记录，如果记录参数 (arsubOpen) 包含一个值1 然后只有我应该启用组合框 B)。为此，我添加了一个类似 A 的商店，并添加了一个过滤器来过滤仅包含 arsubOpen 1 的记录。现在我如何根据这些商店记录启用它们。

Test fiddle

Answer 1

您可以监听 change 事件并将新值与您想要启用第二个组合框的任何值进行比较：

 {
    xtype: 'combobox',
    anchor: '100%',
    displayField: 'description',
    valueField: 'adjustmentTypeId',
    fieldLabel: 'A',
    // lastQuery: '' to disable store loading a second time on trigger click
    lastQuery: '',
    bind: {
        store: '{a}'
    },
    listeners: {
        change: function( combo, value ) {
            // Logging a value to console - remove this code
            console.log( value );

            var store = combo.getStore();
            var record = store.findRecord(combo.valueField, value)
            var arsubOpen = record.get('arsubOpen');
            // Condition for enabling here
            var shouldEnable = arsubOpen === 1;

            var form = combo.up( 'form' );
            var basicForm = form.getForm();
            // 'bField' si the name of the B combobox field
            var bCombo = basicForm.findField( 'bField' );
            bCombo.setDisabled( !shouldEnable );
        }
    }
},
{
    xtype: 'combobox',
    anchor: '100%',
    // Field name to use for form submitting and finding the field
    name: 'bField',
    displayField: 'description',
    valueField: 'arOnlySubCategoryId',
    fieldLabel: 'B',
    // lastQuery: '' to disable store loading a second time on trigger click
    lastQuery: '',
    bind: {
        disabled: 'disableB',
        store: '{B}'
    }
}

一个fiddle根据自己的。

我加入了 lastQuery: '' 配置以禁止在触发点击时第二次加载商店，这真的很烦人，我花了很多时间才找到解决方案。

如何禁用基于 viewModel store returnrd data extjs 的组件

How to disable a component based on viewModel store returnrd data extjs

extjs

extjs4

viewmodel

extjs5

sencha-architect