var addRoot = new Ext.tree.AsyncTreeNode({
text : 'root',
expanded : true,
id : 'rootNodeId'
});
var addMenuTree = new Ext.tree.TreePanel({
loader : new Ext.tree.TreeLoader({
baseAttrs : {},
dataUrl : url_
}),
root : addRoot,
autoScroll : true,
animate : false,
useArrows : false,
border : false,
listeners: {
click: menuTreeClick
}
});
var comboxWithTree = new Ext.form.ComboBox({
store: new Ext.data.SimpleStore({
fields: [],
data: [[]]
}),
editable: false,
allowBlank: false,
emptyText: '请选择...',
fieldLabel: '上级节点',
anchor: '99%',
mode: 'local',
triggerAction: 'all',
maxHeight: 355,
name: 'parentName',
tpl: "<tpl for='.'><div style='height:390px'><div id='addMenuTreeDiv'></div></div></tpl>",
allowBlank: false,
onSelect: Ext.emptyFn,
listeners: {
expand: comboxWithTreeExpand
}
});
function comboxWithTreeExpand() {
// 将UI树挂到treeDiv容器
addMenuTree.render('addMenuTreeDiv');
// addMenuTree.root.expand(); //只是第一次下拉会加载数据
addMenuTree.root.reload(); // 每次下拉都会加载数据
}
function menuTreeClick(node) {
comboxWithTree.setValue(node.text);
comboxWithTree.collapse();
}
实现了带tree的combobox。
Ext3 combo with tree
最新推荐文章于 2019-07-21 16:31:00 发布