Question

我有两个组合框，每个组合框分别用于网站和域。我需要做的是在第一个下拉列表中选择一个值，其他下拉列表中的值应进行过滤。我已经编写了以下代码：

var webSiteComboStore = Ext.create('Ext.data.Store', {
            fields : ['WebsiteNo','WebsiteName'],
            proxy : {
                url : 'getListOfWebsites',
                type : 'ajax'
            }
    });


var win= Ext.create('Ext.window.Window',{
 layout: 'anchor',
 id:'myWin',
 width:500,
 modal:true,
 resizable:true,
 autoScroll:true,
 bodyPadding:'30px',
 title:"Add "+me.clicked.text,

 items:[{
  xtype:'combo',
  fieldLabel:'Website',
  emptyText:'Select',
  anchor:'90%',
  margin:'10 30 10 20',
  multiSelect : false,
  store : webSiteComboStore,
  editable:false,
  forceSelection:true,
  displayField : 'WebsiteName',
  valueField : 'WebsiteNo',
  submitEmptyText :'false',
  listeners:{
      'change':function(){
          var comboVal = this.value;
          this.up().items.items[1].bindStore(null);
          if(this.isDirty()){
            var  filteredDomainStore =   Ext.create('Ext.data.JsonStore',{
                autoDestroy: true,
                fields:['FilteredDomainName','FilteredDomainRefno'],        

                proxy: {
                    type :'ajax',
                    url:'getListOfDomainsForWebsite.action',
                    extraParams:{
                        websiteRefno : comboVal
                    },
                    timeout:1000000,
                    reader:{
                        type:'json',
                        root:'domainsForWebsite'                
                }       
                }
                });  
            this.up().items.items[1].bindStore(filteredDomainStore);
          }

        }

  }
},{
      xtype:'combo',
      fieldLabel:'Domains',
      emptyText:'Select',
      anchor:'90%',
      margin:'10 30 10 20',
      multiSelect : false,
      store : null,
      editable:false,
      forceSelection:true,
      displayField : 'FilteredDomainName',
      valueField : 'FilteredDomainRefno',
      submitEmptyText :'false'
  }
]
});

'webSiteComboStore'是我为网站组合框定义的商店。在第一个组合框的'change'事件中，我正在为第二个（域）组合框创建商店。

第一次，如果我在第一个组合框中选择任何值，其他组合框值将被过滤。但是，当我在第一个组合中选择其他值时，甚至在进入并单击第二个组合之前，控制台中都会显示此错误

Uncaught TypeError: Cannot read property 'isSynchronous' of null

不用说，第二个组合仅显示先前的值，单击时出现后续错误

'Uncaught TypeError: Cannot read property 'findExact' of null'

您可以在下面的屏幕截图中找到提到的错误

我对ExtJS很陌生，我编写的代码主要是借助Internet进行的。请提出您的建议。

Answer 1

不要在每次更改第一个组合框中的值时创建商店。在适当的change上创建两个存储并在select或extraParams事件上加载数据更为合理（请参阅@FabioBarros注释，我也使用这种方法）。查看下一个示例，它可能会对您有所帮助：

Ext.onReady(function(){

    var webSiteComboStore = Ext.create('Ext.data.Store', {
        fields: ['WebsiteNo','WebsiteName'],
        proxy: {
            url: 'getListOfWebsites',
            type: 'ajax'
        }
    });

    var domainStore =   Ext.create('Ext.data.JsonStore',{
        autoDestroy: true,
        fields: ['FilteredDomainName','FilteredDomainRefno'],        
        proxy: {
            url: 'getListOfDomainsForWebsite.action',
            type: 'ajax',
            extraParams:{
                websiteRefno: ''
            },
            timeout: 1000000,
            reader:{
                type: 'json',
                root: 'domainsForWebsite'                
            }       
        }
    });  

    var win = Ext.create('Ext.window.Window',{
        layout: 'anchor',
        id: 'myWin',
        width: 500,
        modal: true,
        resizable: true,
        autoScroll: true,
        bodyPadding: '30px',
        title: "Add "+me.clicked.text,
        items: [
            {
            xtype: 'combo',
            fieldLabel: 'Website',
            emptyText: 'Select',
            anchor: '90%',
            margin: '10 30 10 20',
            multiSelect: false,
            store: webSiteComboStore,
            editable: false,
            forceSelection: true,
            displayField: 'WebsiteName',
            valueField: 'WebsiteNo',
            submitEmptyText: 'false',
            listeners: {
                'change': function(f) {
                    var comboVal = f.value;
                    domainStore.proxy.extraParams = {
                        websiteRefno: comboVal
                    };
                    domainStore.load();
                }
            }
            },
            {
            xtype: 'combo',
            fieldLabel: 'Domains',
            emptyText: 'Select',
            anchor: '90%',
            margin: '10 30 10 20',
            multiSelect: false,
            store: domainStore,
            editable: false,
            forceSelection: true,
            displayField: 'FilteredDomainName',
            valueField: 'FilteredDomainRefno',
            submitEmptyText: 'false'
            }
        ]
    });

});

根据其他组合框中的值来填充组合框存储

1 个答案: