Question

我有一段代码可以在选中复选框时激活组合框。选中复选框后，我可以从组合框中选择一个值。但是，一旦取消选中该复选框，我希望组合框返回没有值（空白）。我怎么做？我的代码如下：

var tests = [
['Test1'],
['Test3'],
['Test2']
];
Ext.define('Test', {
    extend: 'Ext.data.Model',
    fields: ['test']
});
var testsStore = new Ext.data.Store({
    model: 'Test',
    proxy: {
        type: 'memory',
        reader: {
            type: 'array'
        }
    },
    data: tests
});
var form = Ext.create('Ext.form.Panel', {
    renderTo: document.body,
    bodyPadding: 10,
    width: 550,
    style: 'margin:16px',
    height: 300,
    title: 'Testing example',
    items: [{
        xtype: 'checkboxfield',
        name: 'system',
        boxLabel: 'Production (PACTV)',
        inputValue: 'production',
        listeners: {
            change: function (checkbox, newValue, oldValue, eOpts) {
                var combo = checkbox.up('form').down('combobox');
                if (newValue) {
                    Ext.getCmp('secondComboID').setReadOnly(false);
                    Ext.getCmp('secondComboID').allowBlank = false;
                    Ext.getCmp('secondComboID').validate();
                } else {
                    Ext.getCmp('secondComboID').setReadOnly(true);
                    Ext.getCmp('secondComboID').allowBlank = true;
                    Ext.getCmp('secondComboID').validate();
                }
            }
        }
     }, {
        xtype: 'combobox',
        fieldLabel: 'Select Test',
        readOnly: true,
        id: 'secondComboID',
        store: testsStore,
        valueField: 'id',
        displayField: 'test',
        typeAhead: true,
        forceSelection: true,
        editable: true,
        triggerAction: 'all',
        lastQuery: ''
    }]
});

这是一个工作小提琴：https://fiddle.sencha.com/#view/editor&fiddle/1u9n

Answer 1

取消选中复选框时，请在小提琴中使用此项：

Ext.getCmp('secondComboID').reset();

Answer 2

使用此代码从组合中删除数据或在组合中加载空数组数据

setTimeout(() => {
  expect(this.component.colors).to...
});

此外，如果您希望再次加载以前的数据，这里有一个示例，它允许我们切换以加载数据并从组合中删除数据试试FIDDLE

使组合框的值变为空白

2 个答案: