ext中对json数据的处理解析

(注:ext做客户端接收数据，返回的json数据必须要有存放载体,也就是ext中的Ext.data.Store)

1、Ext.form.ComboBox() 控件:(将json格式数据信息显示到下拉框中)
说明:本例采用的json.jar 2.2.1-version(下同)
前台:

var combobox = new Ext.form.ComboBox({ id:'type', name:"type", editable:false, readOnly:true, mode:'remote', emptyText:"请选择", store:new Ext.data.Store({ proxy: new Ext.data.HttpProxy({ url: 'TestAction!test.action'//请求路径 }), reader: new Ext.data.JsonReader({ root: 'rows', totalProperty: 'results', fields:['code','desc'] }), autoLoad:true }), valueField:'code', //逻辑列名的实际值(tId) displayField:'desc', //逻辑列名的显示值(tName) triggerAction:'all', //是否开启自动查询可选:all(不开启)、query(开启) labelSeparator:'', width:120 });

后台：
List<Obj> list = testService.loadType(condition);//这是方法返回的list数据,根据需要而定,在此这是举例说明问题. JSONObject json = new JSONObject(); JSONArray jsonObjects = new JSONArray(); int i=0; Iterator<Obj> it = list.iterator(); while(it.hasNext()){ JSONObject jsonObject = new JSONObject(); Obj obj = it.next();//这里的Obj对象只是list中的存放的对象类型 jsonObject.put("desc", obj.getTypeDesc()); jsonObject.put("code", obj.getTypeCode()); jsonObjects.put(i++, jsonObject); } json.put("results", list.size()); json.put("rows", jsonObjects); outJsonString(json.toString());

这里返回的json字符串如下:
{"results":2,"rows":[{"desc":"选项一","code":"101"},{"desc":"选项二","code":"102"}]}

2、Ext.grid.GridPanel() 控件:(将json格式信息显示到GridPanel中)
说明:我这里说明的不是GridPanel而是里面的store,所以GridPanel里面的有些内蓉省掉了(如分页等,个人认为简单明了比较好)。
前台:
var grid = new Ext.grid.GridPanel({ autoWidth:true, height:300, cm:cm, //列模型(这里就省了,注意:列模型形式一定要和返回的数据个数及名称一致) loadMask:{msg:'正在加载中,请稍后..'},//加载时显示的等待信息 store:store }); var store = new Ext.data.Store({ proxy:new Ext.data.HttpProxy({url:'TestAction!test.action'}), reader:new Ext.data.JsonReader({ totalProperty:'results', root:'jsonObjs' }, [ {name:'id'}, {name:'name'}, {name:'sex'}, {name:'address'} ] ), softInfo:{field:'id',direction:'DESC'}//排序 });
后台：
List<Users> list = testService.loadType(condition);//这里的方法说明同上 JSONObject json = new JSONObject(); JSONArray jsonObjects = new JSONArray(); int i=0; Iterator<Users> it = list.iterator(); while(it.hasNext()){ JSONObject jsonObject = new JSONObject(); Users user = it.next();//这里的Users对象就不多说了，同上 jsonObject.put("id",user.getId()); jsonObject.put("name", user.getName()); jsonObject.put("address", user.getAddress()); jsonObject.put("sex", user.getSex()); jsonObjects.put(i++, jsonObject); } json.put("results", list.size()); json.put("jsonObjs", jsonObjects); outJsonString(json.toString());

这里返回的json字符串如下:(这里只有一条数据)
{"results":1,"jsonObjs":[{"id":"11101","name":"xiesj","address":"nj","sex":"man"}]}

3、Ext中作form表单提交时返回的json数据：(主要用于判断后台提交是否成功)
说明:下面是一个保存时的表单提交对返回json数据的处理解析，这个比较简单
前台:
myFormPanel.form.submit({ //FormPanel的定义及设置就省了,简单明了最好！ waitTitle:'请稍后', waitMsg:'正在保存数据,请稍后。。。', url:'TestAction!saveData.action', method:'POST', success:function(form,action){ if(action.result.info == 'success'){//这就是对json数据的解析 Ext.Msg.alert("提示框","保存成功!"); return; }else{ Ext.Msg.alert("提示框","保存失败!"); return; } }, failure:function(form,action){ Ext.Msg.alert("提示框","数据匹配错误，请重新填写!"); return; } });
后台：
String rslt_o = testService.save(condtions);//返回的值其实就两个:success和failure //String flag = "{success:true,info:'" + info.toString() + "'}"; //outJsonString(flag); outJsonString("{success:true,info:'" + info.toString() + "'}"); //拼装返回(以上注释中的形式也可)

这里返回的json字符串如下:
{success:true,info:'success'} 或 {success:true,info:'false'}

4、Ajax请求提交时返回的json数据:(接收返回信息)
说明:这里对返回过来的json数据，用eval函数做了处理
前台:
var resultObject = null; Ext.Ajax.request({ url:'testAction!test.action', method:'POST', success:function(result,request){ resultObject = eval('('+result.responseText+')'); Ext.Msg.alert('提示框',resultObject.message); return; }, failure:function(){ Ext.Msg.alert('提示框','操作失败!'); return; } });
后台：
String message = testService.test(map); JSONObject jsonObj_info = new JSONObject(); jsonObj_info.put("message", message); outJsonString(jsonObj_info.toString());

这里返回的json字符串如下:
{"message":"指定月份没有对应抄表数据!"}或{"message":"指定待计算月份不准确!"}或{"message":"计算完成!"}

ext中对json数据的处理解析

浏览过的版块