开发者

ExtJS: Linked combobox puzzle

开发者 https://www.devze.com 2023-01-18 05:34 出处:网络
I write special combo object to use it as linked combos. Here it is: comboDivClass = Ext.extend(Ext.form.ComboBox, {

I write special combo object to use it as linked combos. Here it is:

comboDivClass = Ext.extend(Ext.form.ComboBox, {
            fieldLabel: 'Divisions',
            anchor: '95%',
            lazyRender:true,
            store:new Ext.data.Store({
                  proxy: proxy,
                  baseParams:{rfb_type:'divisions'},
                  reader: divReader,
                  autoLoad: true
            }),
            displayField:'div_name',
            allowBlank:false,
            valueField:'div_id',
            triggerAction:'all',
            mode:'local',
            listeners:{
                select:{
                    fn:function(combo, value) {

                        if (this.idChildCombo) {
                            var modelCmp = Ext.get开发者_开发百科Cmp(this.idChildCombo);
                            modelCmp.setValue('');
                            modelCmp.getStore().reload({
                                params: { 'div_id': this.getValue() }
                            });
                        }   
                    }
                }
            },/**/
            hiddenName:'div_id',
            initComponent: function() {comboDivClass.superclass.initComponent.call(this);}})

As you may see, this combobox load data at child combobox store(which set as idChildCombo). Ok. Here is how i declare it

new comboDivClass({id:'sub0div',idChildCombo:'sub1div'}),
new comboDivClass({id:'sub1div'})

Yes it works, but it have some odd trouble - it load not only sub1div store, it load at sub0div store too. Why? What im doing wrong?


One thing I see is that you have mode: 'local' config, while it should be remote.

Other thing to consider: Why don't you do it more like this:

var c1 = new comboDivClass({id:'sub0div'});
var c2 = new comboDivClass({id:'sub1div'});
c1.on('select',function(combo, value) {c2.getStore().reload({
  params: { 'div_id': c1.getValue() }
})});


ChildCombo.setMasterField( masterField ) {
  masterField.on('change', function(field){
    this.getStore().filterBy( function(){ //filter by masterFIeld.getValue() } );
  })
}

The idea is to link child field to parent not parent to child and this way you can link to any kind form field no only combo.

Here in child combo you have to have store with three columns [group,value,label] where group is value of master field.

This way you can manage to have mode than one master field.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号