combtree

  想打开一个下拉框,里面是一个树吗?

  嘿嘿,就像这样.

 

  代码其实很简单的.

 

var comboxWithTree = new Ext.form.ComboBox({
		store:new Ext.data.SimpleStore({fields:[],data:[[]]}),
		editable:false,
		shadow:false,
		mode: 'local',
		triggerAction:'all',
		maxHeight: 200,
		tpl: '<tpl for="."><div style="height:200px"><div id="tree1"></div></div></tpl>',
		selectedClass:'',
		onSelect:Ext.emptyFn
	});
	var tree1 = new Ext.tree.TreePanel({
		loader: new Tree.TreeLoader({dataUrl:'get-nodes.php'}),
		border:false,
 		root:new Ext.tree.AsyncTreeNode({text: 'treeRoot',id:'0'})
  	});
  	tree1.on('click',function(node){
  		comboxWithTree.setValue(node.text);
  		comboxWithTree.collapse();
  	});
	comboxWithTree.on('expand',function(){
		tree1.render('tree1');
  	});
	comboxWithTree.render('comboxWithTree');

  其实很简单的, 不需要多说明吧.原理就是在下拉框里面定义一个div,在用树去渲染

评论

1 楼 mniz 2008-11-02  

我想问下，把树放到下拉框里面去了，我怎么去值给后台呢，我直接Ext.getCmp('').getValue() 取不到值，还望LZ帮下忙 谢谢。。

是直接取树的值啊，还是？？？

我把我的代码放上来，搞不定啊 帮我看下，行吗？

  Ext.onReady(function(){
	var combotree = new Ext.form.ComboBox({
		id:'comboreee',
		store:new Ext.data.SimpleStore({fields:[],data:[[]]}),   //数据
		editable:false,//是否可编辑的表格
		selectClass:'',//适用于所有样式
		mode: 'local',   //本地数据
		triggerAction:'all',  //是否自动匹配
		autoHeight: true,
		tpl: "<tpl for='.'><div style='height:200px'><div id='tree'></div></div></tpl>",   //模板 循环
		//onSelect:Ext.emptyFn,
		applyTo: 'combo'
	});
	
	var treedata = new Ext.tree.TreeLoader({
		url:'http://localhost:8080/pkm/register!queryChild.action'
	});
	var tree = new Ext.tree.TreePanel({
		loader:treedata,
		border:false, 
		root:new Ext.tree.AsyncTreeNode({text:'目录结构',id:'1'})
	});
	
	tree.on('click',function(node){   
          combotree.setValue(node.text);   //给combo设置键的值
          combotree.collapse();   //隐藏下拉列表中，如果它展开，这个属性将会完成数据的加载
      });   
	combotree.on('expand',function(){
		tree.render('tree');//ComboBox的tpl里的<div id='tree'>这个ID可以改成别的, 但必须要在'expand'事件里, 将树显示在这个div上
	});
	
});

就这样我不知道怎么取值??

combotree.on("select",function(ComboBox){
   alert("测试是否进来");
   alert(ComboBox.getValue());//这里不能不显示值？？？ 不知道什么原因啊 ，而且这个方法它根本不进来
});