`
zzplovejava
  • 浏览: 6807 次
  • 性别: Icon_minigender_1
  • 来自: 合肥
文章分类
社区版块
存档分类
最新评论

EXTJS4下拉树写法

阅读更多
/**
    * 创建下拉树
    * @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();
分享到:
评论

相关推荐

    Extjs4 下拉树 TreeCombo

    ExtJS 4 下拉树(TreeCombo)是一种组合控件,它将传统的下拉框与树形结构结合在一起,提供了一种在有限空间内展示层级数据的高效方式。...你可以根据这些文件来理解和构建自己的ExtJS 4下拉树组件。

    Extjs4下拉树菜单ComboBoxTree支持单选和多选并且支持展开选中指定节点的通用控件

    在这个特定的情况下,我们讨论的是一个定制的下拉树菜单控件——ComboBoxTree,它在ExtJS4中实现了单选和多选功能,并且具备展开选中指定节点的能力。这个控件在实际项目中已经被广泛使用并证明了其稳定性和实用性,...

    ExtJs4.2下拉树(修改版)

    ExtJs4.2没有直接提供下拉树这个组件,但是有例子可以用,文件位置:ext-4.2.1.883\examples\ux\TreePicker.js 但是它有点小毛病吧:默认显示了根节点;达到最小高度时再展开节点,高度不能自动调整。 所以我做了一...

    ExtJs3下拉树

    ExtJs3下拉树 分两种方式调用:第一种: xtype : 'combotree', name : 'dm', fieldLabel : 'dm', tree : this.ct this.ct = new Ext.tree.TreePanel({ autoScroll : true, height : 250, border : false, ...

    Extjs4 下拉树( v1.0版本有bug,已经上传一个可以用的)

    标题中的“Extjs4 下拉树”指的是EXTJS框架中的一个组件,用于实现下拉菜单与树形结构的结合,这种组件通常在需要选择层级结构数据时非常有用,比如地区选择、组织架构选择等。EXTJS是Sencha公司开发的一个...

    ExtJS4下拉树组件

    ### ExtJS4 下拉树组件知识点详解 #### 一、概述 在ExtJS4中,下拉树组件(TreeComboBox)是一种特殊的组合框,它结合了下拉列表和树形结构的功能,允许用户通过选择树节点来填充组合框的值。这种组件广泛应用于...

    Extjs下拉多选树

    在ExtJS中,"下拉多选树"(Combobox Tree)是一种结合了下拉框和树形结构的组件,它允许用户在下拉菜单中选择多个树节点,提供了一种高效且直观的用户交互方式。 1. **下拉树组件**:在ExtJS中,树形组件...

    ExtJs下拉树

    在ExtJS中,下拉树(ComboBoxTree)是一种结合了下拉框和树结构的组件,它允许用户从一个展开的树形列表中选择值,而不是传统的单行文本输入或简单的下拉列表。这种组件在数据层级结构复杂且需要用户进行多级选择时...

    extjs下拉树

    4. **添加到容器**:将下拉树组件添加到容器或面板中,以便在页面上显示。 ```javascript var formPanel = Ext.create('Ext.container.Container', { layout: 'fit', // 使用fit布局,使下拉树填满容器 items: ...

    extjs4 下拉菜单树 combobox+tree 支持单选多选

    在EXTJS4中,下拉菜单树(ComboBox+Tree)是一种高级UI组件,它结合了ComboBox的下拉选择框和TreePanel的树形结构,提供了一种用户友好的交互方式,用于展示层次化的数据。这种组件特别适用于需要从多个选项中进行...

    extjs4 实现下拉树并支持复选

    在EXTJS4中,实现一个下拉树(Combobox Tree)并支持多选和复选功能,主要是通过自定义组件(Ext.define)来完成的。这个组件继承自EXTJS的Picker字段(Ext.form.field.Picker),并添加了树形结构和复选功能。以下...

    Extjs4下拉菜单ComboBox中用Grid显示通用控件

    在EXTJS4中,`ComboBox` 是一个非常常用的组件,它提供了一个下拉选择框的功能。在某些场景下,我们可能需要在下拉菜单中展示更丰富的信息,比如表格数据,这时就可以使用 `GridComboBox`。`GridComboBox` 结合了 `...

    Extjs4 多选下拉树

    在ExtJS4中,多选下拉树(Multi Select Tree)是一种用户界面组件,它结合了下拉菜单和树形结构,允许用户从层级结构中选择多个项目。这个组件在数据管理、分类选择等场景中非常实用。 在实现多选下拉树时,我们...

    Extjs6中利用treePicker实现的下拉树中

    利用extjs6自带的treePicker插件,实现下拉树的效果

    Extjs4 下拉树

    使用方法: var comb = Ext.create('Ext.ux.ComboTree',{ name:'xzqh', dicName:'test', width : 270, fieldLabel : '行政区划', url:'getDic', all:true, labelWidth : 60, multiple:true ...

    Extjs自定义组件-下拉树

    ### Extjs自定义组件——下拉树:深入解析与实现 在现代Web开发中,Extjs作为一款功能强大且灵活的框架,深受开发者喜爱。它提供了丰富的UI组件库,能够帮助开发者快速构建复杂的用户界面。其中,自定义组件是Extjs...

    Extjs4.X下comboboxTree下拉树型菜单,完美支持多选、单选,绝对好用

    同时,还需要配置`mode`为`EXTJS4`特有的`EXTJS4`模式,以启用树结构的多选功能。 3. **数据源与模型** 数据源通常通过`store`属性指定,可以是本地数据或者远程加载的数据。对于树形结构,需要使用`TreeStore`,...

    extjs树形下拉框treeField

    extjs 树形下拉列表框,可以进行数据选择,数据回显。

    Extjs ComboBoxTree 下拉树组件

    4. **自定义渲染**:为了展示树结构,ComboBoxTree需要自定义渲染逻辑,将每个节点以树的形式展示在下拉列表中。 5. **事件处理**:为了响应用户的操作,如点击节点、展开/折叠节点等,ComboBoxTree需要绑定相应的...

    ExtJS下拉列表树控件

    在ExtJS中,下拉列表树控件(ComboBox Tree)是常见的组件之一,它结合了下拉列表和树结构,提供了更丰富的用户界面。这个控件允许用户从一个层级化的数据结构中进行选择,非常适合于展示有层次关系的数据。 在创建...

Global site tag (gtag.js) - Google Analytics