关于extjs store远程获取json数组的处理方式

本文介绍了如何在EXTJS4应用中,通过Store组件远程获取并处理Struts2返回的二维JSON数组,特别是在填充ComboBox时的步骤与技巧。内容涉及SSH2框架、Struts2的JSON动作及EXTJS的Store配置和数据解析。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在SSH2框架中,大家会直接使用struts2的json模式直接将对象list生成json字符串,如一个用户列表

List<Users>一般格式为

{"sum":247,"records":[{"id":1,"name":"hellodoom","birth":"1977-01-01",.....},{...}...]},
通过ext的jsonReader方式很容易填充store,而如果生成一个纯二维数组如[[1,'hellodoom','1977-01-01'...],[...]...],这时我们则可以通过arrayReader方式来实现,但如果是这种格式:
{"records":[[1,'hellodoom','1977-01-01'...],[...]...]}
我们该怎么实现呢?
在网上查过很多资料未发现答案,其实这种场景还是很常见的,以users表为例,一般情况下users表会有id\name\sex\birth\...很多属性,但我们经常会只取两个属性id\name用作下拉框用,在hibernate中我们可以使用select new Users(id,name) from Users只取两个字段的值,但其它值还是会设为null,这样当生成json时,还是会生成
{"sum":247,"records":[{"id":1,"name":"hellodoom","birth":null,"age":null.....},{...}...]},虽然我们通过定义fields不会影响生成comboBox,但还是传输了太多无用的字符,有些人会采用直接生成只包含id和name字段的二维数组的方式(呵呵,刚开始我就这样做的,不过因为框架写好了都是直接生成json的,不想为实现这功能再重新修改框架,于是琢磨出下面方法),但还是比较繁琐,下面介绍一下我的解决方案:
hibernate中直接使用select id,name form users,注意与前面select new Users(id,name)的区别,现在的方式不会生成Users对象
通过(List)(sessionFactory.getCurrentSession().createQuery("select id,name form users").list());我们得到一个list,其中并不包含元数据信息,通过struts2直接将其转为json,即得到前文所说的
{"records":[[1,'hellodoom','1977-01-01'...],[...]...]}格式
这种格式既需jsonReader解析,又是array格式,怎么办呢?不得不说extjs 确实做得强:
定义如下fields:
fields: [{
            	name: 'id',
           		mapping: function(raw) {
                      return raw[0];
           		 }
        		}, {
		            name: 'name',
		            mapping: function(raw) {
		               return raw[1];
           			 }
      		  }],
呵呵,看明白了吧,直接将第一个对象转为id,第二个对象转为name!剩下的就是基础知识了吧
附上combox完整代码:
var cb_users_ds =new Ext.data.Store({
			pageSize:0,
			fields: [{
            				name: 'id',
           				mapping: function(raw) {
                    			 	 return raw[0];
           				 }
        			}, {
		          		  name: 'name',
		           		 mapping: function(raw) {
		              			 return raw[1];
           				 }
      				  }],
			proxy : {
				type : 'ajax',
				actionMethods : {
					read : 'POST' // post方法解决中文参数乱码问题
				},
				url : 'hr/users!getUsersComboBox',  //生成格式:{"records":[[1,"张三"],[2,"李四"],[10,"王五"]...]}

				extraParams : {
					baseSql : '',
					order : 'order by name'
				},
				reader : {
					type : 'json',
					root : 'records'
				}
			}
		});
		var cb_users=Ext.create('Ext.form.field.ComboBox', {
			itemId : 'manager',
			value : '',
			fieldLabel : '选择用户',
			selectOnFocus : true,
			displayField: 'name',
    			valueField: 'id',
			editable : true,
			store : cb_users_ds
		});
java端大家自己实现吧,实现起来应该太低级了吧


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值