`
忧里修斯
  • 浏览: 432477 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

ComboBox远程获取数据

阅读更多
1、前台js
Ext.onReady(function() {
	var cfg = {};// 组合框配置
	cfg['fieldLabel'] = '父菜单';
	cfg['url'] = 'comboServer.jsp';
	cfg['recordType'] = 'Menu', cfg['fields'] = ['name', 'idno'];
	cfg['name'] = 'parentid';
	var combo = Ext.combo.createComboBox(cfg);

	var form = new Ext.FormPanel( {
		frame : true,
		applyTo : document.body,
		items : [combo]
	});
});


2、封装的Ext.combo
/**
 * 封装ComboBox,如
 * var cfg = {};
 * cfg['fieldLabel'] = '父菜单'; 标签
 * cfg['url'] ='comboServer.jsp'; 请求的url
 * cfg['recordType'] = 'Menu', 记录类型
 * cfg['fields'] = ['name','idno']; 
 * cfg['name'] = 'parentid';字段名称
 */
Ext.combo = {
	createComboBox : function(cfg) {
		var fields = new Array();
		fields = cfg.fields;
		var record = Ext.data.Record.create([ {
			name : fields[0]
			,
		}, {
			name : fields[1]
		}]);
		var myReader = new Ext.data.XmlReader( {
			totalRecords : "totalNum",
			record : cfg.recordType
			,
		}, record);

		var comboStore = new Ext.data.Store( {
			autoLoad : true,
			url : cfg.url,
			reader : myReader
		});

		var combo = new Ext.form.ComboBox( {
			fieldLabel : cfg.fieldLabel,
			store : comboStore,
			value : '请选择...',
			editable : false,// 不可编辑
			name : cfg.name,
			displayField : fields[0],// 显示的字段
			valueField : fields[1],// 实际值字段
			triggerAction : 'all'
		});
		return combo;
	}
};


3、comboServer.jsp,用于从数据库中获取要查询的菜单信息,并以xml格式返回

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page import="com.dreamoa.sys.BaseParams"%>
<%@page import="com.dreamoa.sys.Loader"%>

<%
	BaseParams bp = new BaseParams();

	Loader loader = new Loader("menu.xml", "SEL_PARENT_MENU", bp);
	response.setContentType("text/xml");
	response.getWriter().write(loader.resultsXmlString);
%>


4、hql语句如下,注意一定要查询出所有字段,原因还不清楚。即不能使用如下语句

<query>
	<queryName>SEL_PARENT_MENU</queryName>
	<queryString>select m.idno,m.name from Menu m where m.parentid='0</queryString>
</query>

只能使用下面的:
<query>
	<queryName>SEL_PARENT_MENU</queryName>
	<queryString>from Menu m where m.parentid='0'</queryString>
</query>


1
0
分享到:
评论

相关推荐

    ComboBox(下拉列表框)通过url加载调用远程数据的方法

    url:通过URL加载远程列表数据。 mode:定义了当文本改变时如何读取列表数据。设置为’remote’时,下拉列表框将会从服务器加载数据。当设置为“remote”模式时,用户输入将被发送到名为’q’的HTTP请求参数到服务器...

    EXTJS的COMBOBOX级联实现和数据提交VALUE[文].pdf

    mode配置决定了ComboBox的数据来源,'local'表示数据在本地,'remote'则表示数据从远程获取。readOnly配置可以防止用户手动编辑输入框。triggerAction定义了用户点击触发器后执行的动作,'all'表示显示整个列表,而...

    Extjs之旅-combox之远程加载数据

    这时,远程加载数据就显得尤为重要,它通过异步请求从服务器获取数据,只在需要时才加载,显著提高了用户体验。 远程加载数据的核心在于Store和Ajax源。Store是ExtJS中管理数据的容器,它可以连接到各种数据源,...

    添加数据ok_combo和Extended Combobox.rar

    5. **数据绑定**:可能支持更复杂的数据源,如数据库或远程API。 6. **扩展的事件处理**:包括更多的事件,比如在用户开始输入时触发的事件,或者在下拉列表展开/关闭时的事件。 文件"combo.sln"是一个Visual ...

    Extjs学习笔记(-):ComboBox联动

    当用户在第一个ComboBox中做出选择时,触发相应的事件处理器,这里可以使用`Ext.getCmp`或`Ext.query`来获取第二个ComboBox并执行相关操作。 3. **数据更新**:在事件处理器中,我们根据第一个ComboBox选择的值去...

    Ext comboBox的remote模式,联想功能实现

    总结起来,Ext JS的comboBox远程模式和联想功能是提高用户体验的有效手段,尤其适用于大数据量的场景。通过合理配置comboBox的相关属性,并结合服务器端的接口,我们可以创建出高效、智能的搜索输入控件。

    ExtJS Combobox二级联动列子

    3. 动态加载:根据第一个Combobox的选中值,向服务器发送请求获取相关联的第二级数据,然后填充到第二个Combobox的Store中。 三、具体步骤 1. 创建Store:定义两个Store,分别用于存储一级和二级的数据,可以使用...

    extjs的ComboBox 2级联动

    需要注意的是,实际应用中可能需要从服务器获取数据并进行异步加载,这时可以使用远程查询(queryMode: 'remote')和Ajax请求。同时,为了提供更好的用户体验,可以在数据加载期间显示加载提示。 在开发过程中,...

    Ext4.0 动态修改ComboBox选择项(本地模式)

    在本地模式下,ComboBox的数据通常存储在本地,如JavaScript数组中,而不是从远程服务器获取。这样可以提高应用的响应速度,减少网络请求。 要实现动态修改ComboBox的选择项,你需要了解以下几个关键步骤: 1. **...

    extjs 自动补全 模拟combobox

    对于更复杂的自动补全功能,例如从远程服务器获取匹配数据,你需要设置`queryMode`为`remote`,并提供一个`load`方法来处理异步请求。`triggerAction`属性可以控制何时触发查询,例如设置为`all`表示用户输入任何...

    EasyUi中的Combogrid 实现分页和动态搜索远程数据

    jquery easyui中的combogrid比较特殊,算是combo和grid的组合,combogrid结合一个可编辑的文本框和下拉数据网格面板,可以让用户迅速找到并选择,又...下面给大家介绍EasyUi中的Combogrid 实现分页和动态搜索远程数据

    flex combobox联动demo

    5. **XML或JSON数据**:联动效果可能涉及到远程数据的获取,例如通过HTTPService或WebService请求。数据通常以XML或JSON格式返回,然后转换为Flex能识别的数据结构。 6. **自定义组件**:为了实现更复杂的功能,...

    Ext中下拉列表ComboBox组件store数据格式用法介绍

    接下来,我们讨论更正规的数据加载方式,即从服务器获取数据字典来填充ComboBox: ```javascript var proj_main_store = new Ext.data.JsonStore({ url : "************", // 服务器接口URL fields : ['TEXT', '...

    模仿extjs风格写的jquery combobox

    - AJAX:用于动态加载数据,可能通过异步请求获取远程数据源。 - 数据绑定:将JavaScript对象或数组与HTML元素绑定,实现数据的实时更新。 - 用户输入处理:监听用户在输入框中的输入,实时过滤显示的选项。 - ...

    第33章 ComboBox(下拉列表框)组件1

    - `mode`:定义数据获取方式,如`remote`表示从服务器加载数据。 - `url`:设置远程数据的加载URL。 - `method`:HTTP请求方法,如`POST`或`GET`。 - `data`:数组形式的本地数据列表。 - `filter`:在本地数据...

    Extjs中ComboBox加载并赋初值的实现方法

    store是Extjs用来存储数据集的一个对象,它可以是一个本地数组也可以是一个远程数据源。当ComboBox通过store加载数据时,这一过程是异步的。也就是说,store.load() 方法会向服务器发送请求并等待数据返回,而不会...

    jQuery EasyUI API 中文文档 – ComboBox组合框

    这里,`url` 指定远程数据的来源,`valueField` 和 `textField` 分别定义了与 ComboBox 值和文本相关的数据字段。 数据格式通常为 JSON,例如: ```json [ { "id":1, "text":"text1" }, { "id":2, "text":"text2...

    extjs中grid中嵌入动态combobox的应用

    还应定义ComboBox的数据存储(store),数据存储可以是本地定义的数组,也可以是远程服务提供的JsonStore。 2. 定义Grid的数据存储:创建一个用于Grid的store,定义其数据源URL、数据字段以及如何解析从服务器返回...

    EXT中COMBOX联动

    9. **远程过滤(Remote Filtering)**:在大型数据集的情况下,联动可能利用远程过滤,即在用户输入时只向服务器请求匹配的子集,以提高性能。 10. **事件传播(Event Propagation)**:理解事件的冒泡和捕捉机制...

Global site tag (gtag.js) - Google Analytics