`
yaya_wiscom
  • 浏览: 48302 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

对Ext ComboBox扩展

阅读更多

 

/*
 * 对EXT ComboBox 的扩展
 */
Ext.BLANK_IMAGE_URL = '/ExtJs/ext2.2/resources/images/default/s.gif';
// Cxt 全局命名空间
var Cxt = {};
Cxt.ComboBoxWrapper = function(config) {
	if (!config) {
		return null;
	}

	var sql = config.sql;

	if (config.sql != '') {
		sql = config.sql;
	} else {
		switch (config.sqlid) {

		case "yxSql" :
			sql = "SELECT YXDM AS VALUE ,YXMC AS TEXT FROM T_XB_DW ORDER BY YXDM";
			break;
		case "zySql" :
			sql = "SELECT ZYDM AS VALUE ,JC AS TEXT FROM T_XB_ZY ORDER BY ZYDM";
			break;
		default :
			sql = "";
			break;
		}
	}

	var store = new Ext.data.JsonStore({
				url : '/ExtJs/app/getSqlData.jsp', // 数据来源
				root : 'combobox',
				fields : [{
							name : 'VALUE'
						}, {
							name : 'TEXT'
						}],
				baseParams : {
					sql : sql
				}
			});

	var combo = new Ext.form.ComboBox({
				store : store,
				emptyText : '请选择..',
				mode : 'local',
				triggerAction : 'all',
				valueField : 'VALUE',
				displayField : 'TEXT',
				width : config.width,
				selectedindex : '080',
				resizable : true,
				id : config.id,
				listeners : {
				    render : function() {
				    },
				    select : function() {
				    }
				}

			});
	store.load(); 
	return combo;
}

// ComboBox包装Tree
Cxt.ComboBoxTree = function(config) {
	var comboxWithTree = new Ext.form.ComboBox({
		store : new Ext.data.SimpleStore({
					fields : [],
					data : [[]]
				}),
		editable : false,
		mode : 'local',
		triggerAction : 'all',
		width : 160,
		resizable : true,
		tpl : "<tpl for='.'><div style='height:200px'><div id='tree'></div></div></tpl>",
		selectedClass : '',
		onSelect : Ext.emptyFn
	});
	var root = new Ext.tree.AsyncTreeNode({
				id : "root",
				text : "树的根"
			});
	var tree = new Ext.tree.TreePanel({
				root : root,
				height : 100,
				border : false,
				rootVisible : false,
				title : '',
				width : 160,
				autoHeight : true,
				loader : new Ext.tree.TreeLoader({
					url : "/ExtJs/app/getComboBoxTree.jsp"
						/*
						 * baseParams : {cc:'1'} isteners : { 'beforeload' :
						 * function(loader, node) {
						 * tree.getLoader().baseParams.cc = '99'; } }
						 */
					})
			})
	tree.getLoader().on("beforeload", function(treeLoader, node) {
		tree.getLoader().baseParams.cc = node.attributes.cc == null ? "": node.attributes.cc;
	}, this);

	tree.on('click', function(node) {
				comboxWithTree.setValue(node.text);
				comboxWithTree.collapse();
			});
	comboxWithTree.on('expand', function() {
				tree.render('tree');
			});
	return comboxWithTree;

}

 

后台对数据的要求:

 

while (rs.next()) {
		JSONObject json = new JSONObject();
		json.put("VALUE", rs.getString("VALUE"));
		json.put("TEXT", rs.getString("TEXT"));
		jObject.append("combobox", json);
}
 

 

分享到:
评论

相关推荐

    combobox Ext之扩展组件多选下拉框

    NULL 博文链接:https://dengli19881102.iteye.com/blog/904770

    Ext带图标Combobox

    基于Ext3.4的一个扩展Combobox组件

    Ext 扩展的带图片的 combobox

    直接放到tomcat下.访问iconcombo.html页面 用的的文件名称如下:iconcombo.html js/Ext.ux.IconCombo.js css/Ext.ux.IconCombo.css

    ext的扩展控件之IconComboBox

    预期将是这样的IconCombo要创建的扩展是一个在文字前面能够显示图标的这么一个Ext.form.Combobox。将其中一个功能举例来说,就是要在一块选择里,国家名称连同国旗一并出现。

    Ext4.1下themeChange

    Extjs4.1下更换主题风格插件。和Extjs2.2下基本差不多,从Ext.form.field.ComboBox扩展而来,选择下拉框内容时将主题风格保存在COOKIET里并应用选择主题风格,初始化时从COOKIET里取出主题风格应用。

    ext-2.2.zip

    在CDH使用oozie 的时候需要安装ext-2.2.zip; 新增和改进的功能包括: 1、FileUploadField 文件上传 ... ...2、GMapPanel GMap扩展 ...我用之前的ext版本 当只有一页数据时,页码导航...Ext.form.ComboBox 的样式就很漂亮!

    Ext Js权威指南(.zip.001

    6.1.7 扩展选择器 / 248 6.1.8 ext.domquery的使用方法 / 249 6.1.9 ext js选择器的总结 / 252 6.2 获取单一元素:ext.dom.element / 252 6.2.1 从错误开始 / 252 6.2.2 使用ext.get获取元素 / 253 6.2.3 ...

    非常好的gwt-ext培训教程

    它扩展了 GWT,在 ExtJs 的基础上实现了有排序功能的表格(Grid)、分页、过滤,支持有拖拽功能的树,高度可定制的组合下拉框(Combobox)、目录、对话框、表单(Form)以及功能丰富、强大且易用的 API。 GWT-Ext ...

    Ext深入浅出 数据传输

    Ext深入浅出 数据传输 第10 章 数据存储与传输........................................附录B EXT 对AIR 的支持.................................. 355 附录C EXT 的版本变迁.......................................

    ExtJSWeb应用程序开发指南(第2版)

    2.5 ExtJS对原有JavaScript对象的扩展 2.5.1 Ext.Array 2.5.2 Ext.Date 2.5.3 Ext.Function 2.5.4 Ext.Number 2.5.5 Ext.String 2.5.6 Ext.Object 2.6 本章小结 第3章 ExtJS4.0的基本功能 3.1 ExtJS组件...

    easyui+增强窗体 demo_ext为实例文件

    1、使用时不再需要显示调用followCustomHandle方法,即可生效扩展属性。 2013-9-3 更新 1、$.showWindow 和 $.showModalDialog 在useiframe=true时,对窗体body增加遮罩控制。 2、easyui.tabs的add方法当useiframe=...

    EfsFrame(java开发框架) v2.2 源代码.rar

    a)扩展对select的应用,默认将select对象渲染为ext的combobox对象, 详细说明见相关文档 b)扩展对多文件、单文件上传的封装(详细说明见相关文档)。 c)扩展高级插件editorgrid(可动态的添加、修改、删除行,对...

    EfsFrame(net开发框架) v2.2 源代码.rar

    a)扩展对select的应用,默认将select对象渲染为ext的combobox对象, 详细说明见相关文档 b)扩展对多文件、单文件上传的封装(详细说明见相关文档)。 c)扩展高级插件editorgrid(可动态的添加、修改、删除行,对...

    EfsFrame(php开发框架) 2.2.rar

    a)扩展对select的应用,默认将select对象渲染为ext的combobox对象, 详细说明见相关文档 b)扩展对多文件、单文件上传的封装(详细说明见相关文档)。 c)扩展高级插件editorgrid(可动态的添加、修改、删除行,对...

    EfsFrame(php开发框架) v2.2 源代码.rar

    a)扩展对select的应用,默认将select对象渲染为ext的combobox对象, 详细说明见相关文档 b)扩展对多文件、单文件上传的封装(详细说明见相关文档)。 c)扩展高级插件editorgrid(可动态的添加、修改、删除行,对...

    轻松搞定Extjs_原创

    第二十二章:GridPanel扩展 158 一、学会自学吧,朋友 158 二、带摘要的GridPanel 158 三、RowExpander 162 四、分组GridPanel 165 五、将带摘要的GridPanel和分组GridPanel合二为一 168 六、小结 171 第二十三章:...

    ExtJs之带图片的下拉列表框插件

    如果图片太大,就会出现覆盖了Combobox中的字,或者出现Icon显示不全种种问题,后来读了IconComboBox的源代码,修改了其中的问题: 在Ext.ux.IconCombo.js这个文件中: 代码如下: /** * Ext.ux.IconC

    Extjs4 下拉多选(Multiple Selection)

    在Extjs4中,下拉多选得以支持,只需要设置Combobox的multiSelect值为...在官网论坛中,发现了一个插件,这个插件是扩展了Combobox多选功能,使得下拉多选更美观、好用。 更多Extjs4信息,请移步 http://www.mhzg.net

    ExtJsCustomComponent:ExtJs自定义组件

    SearchComboBox: 扩展ExtJs4的combobox控件,当输入框改变时就会向后台发送请求,展现数据。TreeField: 扩展ExtJs4的Ext.form.field.Picker类,当点击下拉框时,异步加载树形结构数据的所有层级,需要后台提供树形...

    delphi通用函数单元一

    //▎================① 扩展的字符串操作函数 ===================▎// //▎============================================================▎// //从文件中返回Ado连接字串。 function GetConnectionString...

Global site tag (gtag.js) - Google Analytics