下拉树～不断、持续完善中~

其实，这段时间虽然忙碌，但是正是忙碌让我对ext有更深的认识，对前端、后端有了进一步的认识～

分享一段代码，其实建议看到的亲不要copy使用，真正深入了解它，才是根本。

一段代码背后的东西，才是真正要学习的东西～

/**
 * 原生Ext扩展插件
 */
Ext.define('Ext.ux.comboBoxTree',{
	extend:'Ext.form.field.Picker',
	width:210,//默认宽度210
	/**
	 * 重写Ext.form.field.Picker的initComponent方法
	 */
	initComponent:function(){
		this.callParent();
		this.addEvents('treeselect', 'selectcheck');
		var cfg = this.initialConfig,root = cfg.root,tree = cfg.tree;
		//store-root默认配置
		var rootBasic ={
		     expanded: true,
             children:[]
		}; 

        var treeBasic = {
				floating : true,
				height:300,//tree默认高度300
				autoScroll:true,
				focusOnToFront : false,
				useArrows : true,
				rootVisible: false
		};
        Ext.apply(rootBasic,root);
		var me=this,store = Ext.create('Ext.data.TreeStore', {
			root: rootBasic
		});
        treeBasic.store =  store;
        Ext.apply(treeBasic,tree);

		this.picker = Ext.create('Ext.tree.Panel', treeBasic);
        this.picker.on('itemclick',function(self,rec){
		     if(!rec.get('checked')){
                 var flag = me.fireEvent('treeselect', rec);
                 if(flag){
                	 me.setValue(rec.get('id'));
                	 me.collapse();
                 }
			 }else{
			     rec.set('checked', !rec.get('checked'));
//			     me.fireEvent('checkchange', record, record
//							.get('checked'));
			     //...
			 }
		    
		});
	},
	/**
	 * 得到picker
	 * @return {Ext.tree.Panel}
	 */
	getPicker: function() {
		var me = this;
		me.picker.ownerCt =  me.ownerCt;//添加了ownerCt属性.
		return me.picker || (me.picker = me.createPicker());
	},
	/**
	 * 设置值
	 * @param {Array/String/Number} id
	 */
	setValue:function(id){
		if (!id) {//渲染时没有值
			this.setRawValue('');
		}else{
			var _ids = id.toString().split(',');
			var texts=[],ids=[],store=null;
			for(var i=0,len=_ids.length;i<len;i++){
				var _id = _ids[i];
				if(null==store){store = this.picker.getStore();}
				var node = store.getNodeById(_id);
				if(node){
					texts.push(node.get('text'));
					ids.push(node.get('id'));
					if(node.get('checked')){
						node.set('checked',true);
						node.commit(true);
					}
				}
			}
			this.values = ids.join(',');
			this.setRawValue(texts.join(','));
		}
	},
	/**
	 * 得到值
	 * @return {String} ids 值集合
	 */
	getValue:function(){
	    return this.values;
	}
});

使用样例（不全，在完善和优化扩展类...）：

var picker = Ext.create('Ext.ux.comboBoxTree',{
	       isLeafSelect:true,//添加新的配置属性
		   //picker :panel,
		   root :{
					expanded: true,
					children: [
						{ id:'1', text: "detention", leaf: true },
						{ id:'2',text: "homework", expanded: true, children: [
							{ id:'3',text: "book report", leaf: true },
							{ id:'4',text: "alegrbra", leaf: true}
						] },
						{ id:'5',text: "buy lottery tickets", leaf: true },
						{ id:'6', text: "detention", leaf: true },
						{ id:'7',text: "homework", expanded: true, children: [
							{ id:'8',text: "book report", leaf: true },
							{ id:'9',text: "alegrbra", leaf: true}
						] },
						{ id:'10',text: "buy lottery tickets", leaf: true },
						{ id:'11', text: "detention", leaf: true },
						{ id:'12',text: "homework", expanded: true, children: [
							{ id:'13',text: "book report", leaf: true },
							{ id:'14',text: "alegrbra", leaf: true}
						] },
						{ id:'15',text: "buy lottery tickets", leaf: true },
						{ id:'16', text: "detention", leaf: true },
						{ id:'26',text: "homework", expanded: true, children: [
							{ id:'36',text: "book report", leaf: true },
							{ id:'46',text: "alegrbra", leaf: true}
						] },
						{ id:'56',text: "buy lottery tickets", leaf: true },
						{ id:'66', text: "detention", leaf: true },
						{ id:'76',text: "homework", expanded: true, children: [
							{ id:'86',text: "book report", leaf: true },
							{ id:'96',text: "alegrbra", leaf: true}
						] },
						{ id:'106',text: "buy lottery tickets", leaf: true },
						{ id:'116', text: "detention", leaf: true },
						{ id:'126',text: "homework", expanded: true, children: [
							{ id:'136',text: "book report", leaf: true },
							{ id:'146',text: "alegrbra", leaf: true}
						] },
						{ id:'156',text: "buy lottery tickets", leaf: true }
					]
		   },//store配置
		   tree:{
		   },//树形配置
           renderTo:Ext.getBody()
		});
      picker.on('treeselect',function(rec){
		  if(picker.isLeafSelect){
		     if(rec.get('leaf')==true){
			    console.log(rec);
			 }else{
			 	return false;
			 }
		  }else{
		  	    return false;
		  }

	  });
	});

至于这段代码都是干什么的～呵呵，就是做个记录，具体是什么，暂时让自己知道吧。毕竟水平太差，讲还不如不讲～以免误人子弟。

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

很感谢团队，很多东西一点点领悟，心里也踏实些许～记录今天，有不一样的感觉～。