将下面代码直接复制到相应的位置就可看效果
var comboxWithTree = new Ext.form.ComboBox({
fieldLabel:"使用科室",
hiddenName:'entity.cuseDept',
store:new Ext.data.SimpleStore({fields:[],data:[[]]}),
editable:false,
mode: 'local',
triggerAction:'all',
maxHeight: 200,
tpl: "<tpl for='.'><div style='height:200px'><div id='tree'></div></div></tpl>",
selectedClass:'',
onSelect:Ext.emptyFn
});
var tree = new Ext.tree.TreePanel({
containerScroll: true,//是否支持滚动条
rootVisible:false,//是否显示跟节点
loader:new Ext.tree.TreeLoader({
dataUrl:'base/department!getTree.action'
}) ,
root:new Ext.tree.AsyncTreeNode({
text:'root',
draggable:false,//是否可以拖拽
id:'-1'
})
});
tree.on('click',function(node){
comboxWithTree.setValue(node.text);
comboxWithTree.collapse();
});
comboxWithTree.on('expand',function(){
tree.render('tree');
});
分享到:
相关推荐
TreeCombo是Ext JS库中的一个组件,它结合了树形结构和下拉框的功能,为用户提供了一种在有限空间内展示复杂数据结构的选择方式。在Web应用开发中,这种组件非常实用,尤其当用户需要从层次化的选项中进行选择时。 ...
标题中的“Ext TreeCombo 树形下拉框”是指在ExtJS库中使用的一种特定的UI组件,TreeCombo。这是一个结合了树形结构和下拉框功能的控件,允许用户从一个层次化的数据结构中选择一个或多个项。在ExtJS中,TreePanel...
而在某些情况下,我们可能需要在下拉框中展示树形结构的数据,这就是EXT COMBO TREE的用武之地。 EXT COMBO TREE是EXT COMBO的一种扩展,它允许用户在下拉菜单中以树形结构展示数据。这在处理层级关系或者分类数据...
在ExtJS 4.x框架中,ComboboxTree是一种特殊的组件,它将传统的下拉框与树形结构结合在一起,提供了一种更为灵活的用户输入方式。这种组件在数据选择上非常实用,尤其当数据层级关系复杂时,可以方便地进行多选或...
ExtJS 4 下拉树(TreeCombo)是一种组合控件,它将传统的下拉框与树形结构结合在一起,提供了一种在有限空间内展示层级数据的高效方式。这种控件在很多场合都非常实用,例如在需要用户选择分类或者层级结构的场景中...
下拉树是UI设计中一个实用的元素,它将传统下拉列表与树形结构相结合,用户在下拉框中可以看到层次化的选项,这在需要展示多级分类或者有层级关系的数据时非常有用。例如,在选择国家/地区、组织架构或产品分类等...
下拉树(Dropdown Tree)是EXT中的一个组件,它结合了下拉菜单和树形结构,通常用于选择具有层级关系的数据,比如组织结构、目录树或者地区层级等。 在EXT中,创建下拉树的过程可能涉及到以下关键知识点: 1. **...
这个插件将传统的下拉框与树形结构相结合,提供了更加灵活和直观的数据选择方式,尤其适用于需要展示层级关系数据的场景,如组织结构、地区分类等。 在ExtJS中,`ComboBox`是一个基本的下拉列表组件,它通常用于...
4. **扩展下拉框**:EXTJS允许我们自定义组件,可以通过继承`Ext.form.field.ComboBox`并重写相关方法,比如`onRender`和`onExpand`,来实现下拉框展开时显示树形结构。 5. **事件监听**:添加必要的事件监听器,如...
Ext2.0的下拉树结合了下拉框和树的功能,用户可以像选择下拉列表中的项一样选择树形结构中的节点。创建下拉树需要使用`Ext.form.ComboBox`,并配置其`store`为树形数据的`TreeStore`,`displayField`为显示的字段,...
它提供了一套完整的组件模型,其中包括各种UI控件,如按钮、表格、树形视图以及我们这里关注的“ComboBox”(组合框)。`Ext ComboBox`是实现下拉列表功能的基础组件,而“Ext combobox 下拉多选框带搜索功能”则是...
5. **tree**: 这可能是另一种Ext JS组件——TreePanel,通常用于显示层次结构数据,但在这个上下文中,可能与Combobox的动态更新功能有关,例如,可能通过树形结构来控制Combobox的选项。 综上所述,这个示例可能是...
【Ext 3.x + Ext 2.x 下拉树 Ext.ux.ComboBoxTree】是基于ExtJS框架的一个组件,它结合了下拉框(ComboBox)和树形控件(TreePanel)的功能,提供了一种用户友好的选择界面。在网页应用中,这种控件常用于展示层级...
`ComboBox`是ExtJS中用于创建下拉列表的组件,而`TreeComboBox`则添加了树形结构的功能。以下是对`TreeComboBox`类中关键属性和方法的解释: 1. **store**: 这是数据存储对象,用于存放下拉树中的数据。在示例中,...
ExtJs4.2没有直接提供下拉树这个组件,但是有例子可以用,文件位置:ext-4.2.1.883\examples\ux\TreePicker.js 但是它有点小毛病吧:默认显示了根节点;达到最小高度时再展开节点,高度不能自动调整。 所以我做了一...
综上所述,`ExtJs4.2 下拉框树`的实现涉及到了组件扩展、树形数据处理、界面布局和交互设计等多个方面,通过对`TreePicker.js`的修改,开发者成功地克服了原生框架的限制,提供了更符合需求的下拉树功能。
在Ext 4.0版本中,下拉树的实现主要依赖于几个关键组件:`Ext.tree.Panel`(树面板)、`Ext.form.field.Tree`(树形字段)以及可能用到的`Ext.data.TreeStore`(树存储)。下面我们将详细探讨这些知识点: 1. **Ext...
7. **EXT Tree**:EXT的树形视图组件适用于层次结构数据的展示,可以进行展开、折叠、拖放操作,常用于导航菜单或文件系统。 8. **EXT Theme**:EXT提供了多种主题样式,可以自定义皮肤,满足不同设计需求。同时,...
在ExtJS中,"下拉多选树"(Combobox Tree)是一种结合了下拉框和树形结构的组件,它允许用户在下拉菜单中选择多个树节点,提供了一种高效且直观的用户交互方式。 1. **下拉树组件**:在ExtJS中,树形组件...