javascript - 如何从定义之外更改组合框（Ext JS）的模型

Question

我这里有两个 Ext Combo 框，当 combobox1 的 select 事件调用时，我需要更改第二个组合框的值，我的问题是我不知道如何更改组合框的模型。

   items: [{
        xtype:'combo',
        fieldLabel: 'Course',
        afterLabelTextTpl: required,     
        store: new Ext.data.SimpleStore({
            data: [
                [1, 'Bsc CS'],
                [2, 'MSc CS'],
            ],
            id: 0,
            fields: ['value', 'text']
        }),             
        name: 'first',
        listeners:{

          select: function( combo, records, eOpts )
          {
              if(this.getValue()=="Bsc CS")
              {
                 // Ext.get('semcombo').getStore.loadData(msc);
              }
              else if(this.getValue()=="MSc CS")
              {

              }
          }  

        },
        editable:false,
        allowBlank: false
    },{
        xtype:'combo',
        fieldLabel: 'Semester',
        id : 'semcombo',
        afterLabelTextTpl: required,
        name: 'last',
        allowBlank: false,
    }

Answer 1

对于第二个组合框，为每种模型类型配置一个组合框。在第一个组合框中进行选择时隐藏或显示相应的组合框。

Answer 2

如果您需要完全更改数据（JSFiddle）

select: function(checkbox,records) {
      comp.clearValue();
      comp.bindStore(Ext.StoreMgr.lookup(records[0].data.store));
      // you can change the value field if needed
      comp.displayField = 'petname'; 
      // you can change the display field if needed
      comp.valueField = 'id'; 
      // you can change the display template if needed
      comp.displayTpl = new Ext.XTemplate(
          '<tpl for=".">' +
              '{[typeof values === "string" ? values : values["' + comp.displayField + '"]]}' +
              '<tpl if="xindex < xcount">' + comp.delimiter + '</tpl>' +
          '</tpl>'
      );
      comp.picker = null;
 }

如果您只需要过滤（加载）第二个组合框中的数据，您可以执行以下操作

在第一个组合框的选择事件上，准备第二个组合框来过滤数据

combobox2.queryData = [{ property: 'fieldName', value: value}];
combobox2.reset();
combobox2.doQuery(combobox.queryData);

其中combobox2是对激活的组合的引用和组合value中的属性值。为确保使用您的新查询使用

combobox2.on('beforequery', function (e) {
    e.query = e.combo.queryData;
});