对Ext ComboBox扩展

最新推荐文章于 2024-09-13 17:32:25 发布

yaya_wiscom

最新推荐文章于 2024-09-13 17:32:25 发布

阅读量122

点赞数

分类专栏： Javascript技术文章标签： EXT SQL json JSP

本文链接：https://blog.csdn.net/yaya_wiscom/article/details/83952297

版权

Javascript技术专栏收录该内容

4 篇文章 0 订阅

订阅专栏

/*
 * 对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);
}