將Ext.data.JsonStore綁定到鏈接的組合框

Question

我是extJS的新手。我有2個組合框與公用數據存儲綁定。 下面是商店 -

comboStore = new Ext.data.JsonStore({ 
url: 'Getvalues', 
root: 'rows', 
autoLoad: true, 
fields: ['Type', 'TypeDetails'] 
}); 

這裏Type是一個字符串，TypeDetails是具有場Description一個數組列表。單個Type可以有多個Description。

我的要求是，我有一個組合框綁定Type和當過我選擇Type只curresponding Type的Description應與組合框被綁定2.

我曾嘗試 -

   xtype: 'combo', 
       id: 'cmbType', 
       editable: true, 
       typeAhead: true, 
       allowBlank: false, 
       displayField: 'Type', 
       valueField: 'Type', 
       hiddenName: 'Type', 
       store: comboStore, 
       mode: 'local', 
       triggerAction: 'all', 
       selectOnFocus: true, 
       emptyText: 'Select Type' 
       , listeners: { 
        select: function (cmb, record, index) { 

        } 
       } 



       xtype: 'combo', 
       id: 'cmbDesc', 
       editable: true, 
       typeAhead: true, 
       allowBlank: false, 
       displayField: 'Description', 
       valueField: 'Description', 
       hiddenName: 'Description', 
       store: comboStore, 
       mode: 'local', 
       triggerAction: 'all', 
       selectOnFocus: true, 
       emptyText: 'Select Type first' 

我應該怎麼做combo1 select？ 我正在使用extJS 3.4

Answer 1

您應該使用代理定義的extraParams屬性！如下所示：

/** 
* Model Definition 
*/ 
Ext.define('comboModel', { 
    extend: 'Ext.data.Model', 
    fields: [ 
     {name: 'Type', type: 'int'}, 
     {name: 'TypeDetails', type: 'string'} 
    ] 
}); 

/** 
* Model Definition 
*/ 
Ext.define('descModel', { 
    extend: 'Ext.data.Model', 
    fields: [ 
     {name: 'Description', type: 'int'}, 
     {name: 'DescDetails', type: 'string'} 
    ] 
}); 



/** 
* JsonStore Deifinition 
* 
* Here we will define a JsonStore which will interact server. 
* The returning value type from server should be json! 
* Also, do not forget to specify root and idProperty 
*/ 
var comboStore = new Ext.data.JsonStore({ 
    model : 'comboModel', // you should identify of your model 
    proxy: { 
     type: 'ajax', 
     url: '/path/to/your/server/url', 
     reader: { 
      type: 'json', 
      root: 'rows', 
      idProperty: 'ROOT_ID 
     } 
    } 
}); 

var descriptionStore = new Ext.data.JsonStore({ 
    model: 'descModel', 
    proxy: { 
     type: 'ajax', 
     url: '/path/to/your/server/url', 
     reader: { 
      type: 'json', 
      root: 'descriptions', 
      idProperty: 'DESC_ID' 
     } 
    } 
}); 

xtype: 'combobox', 
store: 'comboStore', 
valueField: 'Type', 
displayField: 'TypeDetails', 
listeners: { 
    select: function(val) { 
     // here is the important part, we are sending the query string 
     // param by url, like /?desc=122332 
     descriptionStore.proxy.extraParams = {'desc': val.getValue()} 
     descriptionStore.load(); 
    } 
} 

xtype: 'combobox', 
store: 'descriptionStore', 
valueField: 'Description', 
displayField: 'DescDetails',