2017-10-17 109 views
0

首先,對不起我的英文。 毫無疑問,在寫作之前,我搜索了很多,但沒有成功。ExtJS 3.4 - comboBox linked

我有兩個鏈接的組合框。 第一個:

var groupe_cible = new Ext.data.JsonStore({ 
    url : "data/fonctions_data.php?pFunction=access_group&user_id=" + p, 
    fields: [ 
     {name: 'value', mapping: 'value', type: 'string'}, 
     {name: 'id', mapping: 'id_group', type: 'int'} 
    ], 
    autoLoad : true 

}); 

JSON結果:

[{"value":"fibre","id_group":1},{"value":"eau_pluviale","id_group":2}] 

第二種:

var param_cible = new Ext.data.ArrayStore({ 
//pruneModifiedRecords: true, 
    autoDestroy: true, 
    url : "data/fonctions_data.php?pFunction=access_param&user_id=" + p, 
    fields: [ 
      {name: 'value', mapping: 'value', type: 'string'}, 
      {name: 'id', mapping: 'id', type: 'int'}, 
      {name: 'groupcode', mapping: 'groupcode', type: 'int'} 
    ], 
     autoLoad : true 
}); 

JSON結果:

[{"value":"vias","id":2,"groupcode":2},{"value":"cahm","id":1,"groupcode":1},{"value":"agde","id":2,"groupcode":2}] 

的鏈接:id_group = groupcode

組合框=

var groupeCombo = new Ext.form.ComboBox({ 
    id: "contenutypetraitementdict", 
    x: 5, 
    y: 55, 
    width : 150, 
    store: groupe_cible, 
    emptyText:'Choisir le type de traitement', 
    valueField: 'id', 
    displayField: 'value', 
    typeAhead: false, 
    editable: false, 
    mode: 'local', 
    allowBlank:false, 
    forceSelection: true, 
    border: false, 
    triggerAction: 'all', 
    //lastQuery: '', 
    selectOnFocus:true, 
    listeners: { 
     select : function(cmb, group, idx) { 
      autosStore = paramCombo.getStore(); 
      paramCombo.clearValue(); 
      autosStore.clearFilter(); 
      autosStore.filterBy(function(item) { 
       var paramCode = item.get('groupcode'); 
       var selected = (paramCode === group.data.id); 
       return selected; 
      }); 
      paramCombo.enable(); 
     } 
    } 
}); 

var paramCombo = new Ext.form.ComboBox({ 
    id: "contenutypetraitementdictparam", 
    x: 5, 
    y: 85, 
    width : 150, 
    store: param_cible, 
    emptyText:'Choisir le type de traitement', 
    allowBlank:false, 
    valueField: 'id', 
    displayField: 'value', 
    //border: false, 
    typeAhead: false, 
    editable: false, 
    mode: 'local', 
    forceSelection: true, 
    triggerAction: 'all', 
    lastQuery: '', 
    selectOnFocus:true 
}); 

然後,兩個組合框是位於FormPanel。 作品鏈接,但我有一個問題:see attachment 下拉列表鏈接,但總有一個默認值。 要舉例說明,如果我點擊「agde」,第二項,最後我總是有第一個值(「過孔」)。

問題很難解決(Firebug沒有問題)。

謝謝。

回答

1

嘗試通過指定的屬性記錄使用filter

過濾。或者,傳遞一組過濾器選項以通過多個屬性進行過濾。單個過濾器示例:store.filter('name','Ed',true,true)

我已經創建了一個sencha fiddle演示,希望這可以幫助您解決問題或實現您的要求。

Ext.onReady(function() { 

    //groupe_cible store 
    var groupe_cible = new Ext.data.JsonStore({ 
     fields: [{ 
      name: 'value', 
      mapping: 'value', 
      type: 'string' 
     }, { 
      name: 'id', 
      mapping: 'id_group', 
      type: 'int' 
     }], 
     type: 'ajax', 
     url: 'groupe_cible.json', 
     type: 'json', 
     root: 'data', 
     autoLoad: true 
    }); 

    //param_cible store 
    var param_cible = new Ext.data.JsonStore({ 
     fields: [{ 
      name: 'value', 
      mapping: 'value', 
      type: 'string' 
     }, { 
      name: 'id', 
      mapping: 'id', 
      type: 'int' 
     }, { 
      name: 'groupcode', 
      mapping: 'groupcode', 
      type: 'int' 
     }], 
     type: 'ajax', 
     url: 'param_cible.json', 
     type: 'json', 
     root: 'data', 
     autoLoad: true 
    }); 

    //groupe_cible combo 
    var item1 = new Ext.form.ComboBox({ 
     mode: 'local', 
     triggerAction: 'all', 
     listClass: 'comboalign', 
     typeAhead: true, 
     forceSelection: true, 
     selectOnFocus: true, 
     displayField: 'value', 
     emptyText: 'Select groupe_cible', 
     valueField: 'id_group', 
     store: groupe_cible, 
     listeners: { 
      select: function (combo, record) { 
       var param_cible = Ext.getCmp('param_cible'), 
        store = param_cible.getStore(); 
       param_cible.setDisabled(false).setValue(''); 
       store.clearFilter(); 
       store.filter('groupcode', combo.getValue()); 

       // You can also use getValue method of Combo 
       // store.filter('groupcode', record[0].get('id')); 
      } 
     } 
    }); 

    //param_cible combo 
    var item2 = new Ext.form.ComboBox({ 
     mode: 'local', 
     triggerAction: 'all', 
     listClass: 'comboalign', 
     typeAhead: true, 
     forceSelection: true, 
     selectOnFocus: true, 
     id: 'param_cible', 
     disabled: true, //initially param cibil will disable 
     emptyText: 'Select param_cible', 
     displayField: 'value', 
     valueField: 'id', 
     store: param_cible 
    }); 

    //create panel with both combo 
    new Ext.Panel({ 
     width: 250, 
     renderTo: document.body, 
     title: 'Filter in Combo on basis of selection', 
     items: [item1, item2] 
    }); 

});