/**
* 创建下拉树
* @param fieldLabel 标签
* @param name
* @param url 请求URL
* @param anchor
* @returns
*/
createTreeCombo: function(fieldLabel, name, url, anchor, allowBlank) {
var df = Ext.create('Ext.form.field.Picker', {
fieldLabel:fieldLabel,
hiddenValue:'',
labelAlign:'right',
anchor:anchor,
allowBlank:allowBlank,
beforeLabelTextTpl: allowBlank ? '':required,
createPicker: function() {
return Ext.create('Ext.tree.Panel', {
pickerField: this,
hidden: true,
height : self.treeHeight||300,
rootVisible : false,//是否显示根节点
autoScroll :true,
floating: true,
minHeight: 300,
store : Ext.create('Ext.data.TreeStore', {
root : {
id:'0',
expanded : true,
hidden:true
},
proxy: {
type: 'ajax',
actionMethods:'post',
url: url,
reader: {
type: 'json'
}
},
fields:['id', 'text']
}),
listeners:{
select: function(thisTree, record, index, obj ){
this.pickerField.setHiddenValue(record.data.id);
this.pickerField.setValue(record.data.text);
this.pickerField.collapse();
}
}
});
},
setHiddenValue: function(value) {
this.hiddenValue = value;
},
getHiddenValue: function() {
return this.hiddenValue;
}
});
return df;
}
取得下拉框中VALUE值用getHiddenValue()方法,取得显示的TEXT值用getValue();
分享到:
相关推荐
ExtJS 4 下拉树(TreeCombo)是一种组合控件,它将传统的下拉框与树形结构结合在一起,提供了一种在有限空间内展示层级数据的高效方式。...你可以根据这些文件来理解和构建自己的ExtJS 4下拉树组件。
在这个特定的情况下,我们讨论的是一个定制的下拉树菜单控件——ComboBoxTree,它在ExtJS4中实现了单选和多选功能,并且具备展开选中指定节点的能力。这个控件在实际项目中已经被广泛使用并证明了其稳定性和实用性,...
ExtJs4.2没有直接提供下拉树这个组件,但是有例子可以用,文件位置:ext-4.2.1.883\examples\ux\TreePicker.js 但是它有点小毛病吧:默认显示了根节点;达到最小高度时再展开节点,高度不能自动调整。 所以我做了一...
ExtJs3下拉树 分两种方式调用:第一种: xtype : 'combotree', name : 'dm', fieldLabel : 'dm', tree : this.ct this.ct = new Ext.tree.TreePanel({ autoScroll : true, height : 250, border : false, ...
标题中的“Extjs4 下拉树”指的是EXTJS框架中的一个组件,用于实现下拉菜单与树形结构的结合,这种组件通常在需要选择层级结构数据时非常有用,比如地区选择、组织架构选择等。EXTJS是Sencha公司开发的一个...
### ExtJS4 下拉树组件知识点详解 #### 一、概述 在ExtJS4中,下拉树组件(TreeComboBox)是一种特殊的组合框,它结合了下拉列表和树形结构的功能,允许用户通过选择树节点来填充组合框的值。这种组件广泛应用于...
在ExtJS中,"下拉多选树"(Combobox Tree)是一种结合了下拉框和树形结构的组件,它允许用户在下拉菜单中选择多个树节点,提供了一种高效且直观的用户交互方式。 1. **下拉树组件**:在ExtJS中,树形组件...
在ExtJS中,下拉树(ComboBoxTree)是一种结合了下拉框和树结构的组件,它允许用户从一个展开的树形列表中选择值,而不是传统的单行文本输入或简单的下拉列表。这种组件在数据层级结构复杂且需要用户进行多级选择时...
4. **添加到容器**:将下拉树组件添加到容器或面板中,以便在页面上显示。 ```javascript var formPanel = Ext.create('Ext.container.Container', { layout: 'fit', // 使用fit布局,使下拉树填满容器 items: ...
在EXTJS4中,下拉菜单树(ComboBox+Tree)是一种高级UI组件,它结合了ComboBox的下拉选择框和TreePanel的树形结构,提供了一种用户友好的交互方式,用于展示层次化的数据。这种组件特别适用于需要从多个选项中进行...
在EXTJS4中,实现一个下拉树(Combobox Tree)并支持多选和复选功能,主要是通过自定义组件(Ext.define)来完成的。这个组件继承自EXTJS的Picker字段(Ext.form.field.Picker),并添加了树形结构和复选功能。以下...
在EXTJS4中,`ComboBox` 是一个非常常用的组件,它提供了一个下拉选择框的功能。在某些场景下,我们可能需要在下拉菜单中展示更丰富的信息,比如表格数据,这时就可以使用 `GridComboBox`。`GridComboBox` 结合了 `...
在ExtJS4中,多选下拉树(Multi Select Tree)是一种用户界面组件,它结合了下拉菜单和树形结构,允许用户从层级结构中选择多个项目。这个组件在数据管理、分类选择等场景中非常实用。 在实现多选下拉树时,我们...
利用extjs6自带的treePicker插件,实现下拉树的效果
使用方法: var comb = Ext.create('Ext.ux.ComboTree',{ name:'xzqh', dicName:'test', width : 270, fieldLabel : '行政区划', url:'getDic', all:true, labelWidth : 60, multiple:true ...
### Extjs自定义组件——下拉树:深入解析与实现 在现代Web开发中,Extjs作为一款功能强大且灵活的框架,深受开发者喜爱。它提供了丰富的UI组件库,能够帮助开发者快速构建复杂的用户界面。其中,自定义组件是Extjs...
同时,还需要配置`mode`为`EXTJS4`特有的`EXTJS4`模式,以启用树结构的多选功能。 3. **数据源与模型** 数据源通常通过`store`属性指定,可以是本地数据或者远程加载的数据。对于树形结构,需要使用`TreeStore`,...
extjs 树形下拉列表框,可以进行数据选择,数据回显。
4. **自定义渲染**:为了展示树结构,ComboBoxTree需要自定义渲染逻辑,将每个节点以树的形式展示在下拉列表中。 5. **事件处理**:为了响应用户的操作,如点击节点、展开/折叠节点等,ComboBoxTree需要绑定相应的...
在ExtJS中,下拉列表树控件(ComboBox Tree)是常见的组件之一,它结合了下拉列表和树结构,提供了更丰富的用户界面。这个控件允许用户从一个层级化的数据结构中进行选择,非常适合于展示有层次关系的数据。 在创建...