PDA

View Full Version : How can refresh the combobox tree when expend it?



zoluro
27 Mar 2012, 2:51 AM
Hi,guys!
I have a combobox tree, it works very well.
Now,I want to refresh tree when expend it, how can do it?

Thanks!

Code:

Ext.require(['Ext.tree.*', 'Ext.data.*', 'Ext.window.MessageBox']);

Ext.define("Ext.ux.comboboxtree", {
extend : "Ext.form.field.Picker",
requires : ["Ext.tree.Panel"],
initComponent : function() {
var self = this;
Ext.apply(self, {
fieldLabel : self.fieldLabel,
labelWidth : self.labelWidth
// pickerAlign : "tl"//??????
});
self.callParent();
},
createPicker : function() {
var self = this;
var store = Ext.create('Ext.data.TreeStore', {
proxy : {
type : 'ajax',
url : self.storeUrl
},
sorters : [{
property : 'leaf',
direction : 'ASC'
}, {
property : 'text',
direction : 'ASC'
}]
});
self.picker = new Ext.tree.Panel({
height : 300,
autoScroll : true,
floating : true,
focusOnToFront : false,
shadow : true,
ownerCt : this.ownerCt,
useArrows : true,
store : store,
rootVisible : false
});
self.picker.on({
beforehide : function(p) {
var records = self.picker.getView().getChecked(), names = [];
Ext.Array.each(records, function(rec) {
names.push(rec.get('text'));
});
// Ext.MessageBox.show({
// title : 'Selected Nodes',
// msg : names.join('<br />'),
// icon : Ext.MessageBox.INFO
// });
// alert(names.join(','));
self.setValue(names.join(','));
p.setVisible(true);// ???
}
});
return self.picker;
},
alignPicker : function() {
// override the original method because otherwise the height of
// the treepanel would be always 0
var me = this, picker, isAbove, aboveSfx = '-above';
if (this.isExpanded) {
picker = me.getPicker();
if (me.matchFieldWidth) {
// Auto the height (it will be constrained by min and
// max width) unless there are no records to display.
picker.setWidth(me.bodyEl.getWidth());
}
if (picker.isFloating()) {
picker.alignTo(me.inputEl, "", me.pickerOffset);// ""->tl
// add the {openCls}-above class if the picker was
// aligned above
// the field due to hitting the bottom of the viewport
isAbove = picker.el.getY() < me.inputEl.getY();
me.bodyEl[isAbove ? 'addCls' : 'removeCls'](me.openCls
+ aboveSfx);
picker.el[isAbove ? 'addCls' : 'removeCls'](picker.baseCls
+ aboveSfx);
}
}
}
});
Ext.onReady(function() {
var com = Ext.create("Ext.ux.comboboxtree", {
storeUrl : 'check-nodes.json',
width : 270,
fieldLabel : '????',
labelWidth : 60,
renderTo : 'tree-div'
});
});

mitchellsimoens
27 Mar 2012, 10:26 AM
The expand event will fire on the combobox when the picker is shown.

edykstra
11 Jul 2012, 9:39 AM
Hey Zoluro,

Could you please provide a sample of the JSON returned by 'check-nodes.json'?

Thanks,

Eric