本文实例为大家分享了Extjs实现下拉树效果，供大家参考，具体内容如下
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>text8</title> <link rel="stylesheet" type="text/css" href="../../../ext-4.2.1/resources/css/ext-all.css" > <script type="text/javascript" src="../../../ext-4.2.1/bootstrap.js"></script> </head><body> <script> Ext.define('TreeComboBox',{ extend : 'Ext.form.field.ComboBox', store : { fields:[], data:[[]] }, width:300, editable : false, allowBlank:false, multiSelect : true, listConfig : { resizable:false, minWidth:150, maxWidth:250, }, _idValue : null, _txtValue : null, callback : Ext.emptyFn, treeObj : null, initComponent : function(){ this.treeObj=new Ext.tree.Panel({ border : false, autoScroll : true, rootVisible: false, renderTo:this.treeRenderId, root: { text: 'root',draggable: false,expanded: true, children:[ { text:'一级节点',expanded: true, checked:false , children:[ { text:'二级节点1',leaf:true,checked:false}, { text:'二级节点2',leaf:true,checked:false} ] } , { text:'一级节点',expanded: true, checked:false , children:[ { text:'二级节点1',leaf:true,checked:false}, { text:'二级节点2',leaf:true,checked:false} ] } ] } , listeners:{ checkchange:function(node,state){ if(node.hasChildNodes()){ for(var i=0;i<node.childNodes.length;i++){ node.childNodes[i].set('checked',state); } } } } }); this.treeRenderId = Ext.id(); this.tpl = "<tpl><div id='"+this.treeRenderId+"'></div></tpl>"; this.callParent(arguments); this.on({ 'expand' : function(){ if(!this.treeObj.rendered&&this.treeObj&&!this.readOnly){ Ext.defer(function(){ this.treeObj.render(this.treeRenderId); },100,this); } } }); this.treeObj.on('itemclick',function(view,rec){ if(rec){ //node.getUI().checkbox.indeterminate = true; //半选中状态 this.setValue(this._txtValue = rec.get('text')); //this.collapse();//关闭tree } },this); }, }); //实例化下拉树 var xltree1=new TreeComboBox({ fieldLabel : '下拉树1', name:'xltree1111', allowBlank:true }); var xltree2=new TreeComboBox({ fieldLabel : '下拉树2', name:'xltree2222', allowBlank:true }); Ext.create('Ext.form.Panel', { renderTo: Ext.getBody(), width: 500, bodyPadding: 10, title: 'TreeComboBox', items: [xltree1, xltree2] }); </script></body></html>问题：当选中复选框时候，如何使全部选中的条目添加显示到combobox中？
效果：
下面是另一个：
效果：
以上就是本文的全部内容，希望对大家学习javascript有所帮助。
最新文章
热门文章
猜你喜欢
