今天被如何解析如下复杂json对象给难住了.. 翻了半天文档也没找出如何在JsonReader中读取json对象的方法(可能也是因为自己E文水平有限没正确理解文档中的意思。)
/*json代码*/ { "loginName":"lvjian0", "password":"1230", "type":{ "typeId":1, "typeName":"近卫" } }
经过一翻baidu+google终于找到了解决方案:
使用convert:function(v){} 对复杂对象进行处理:
具体代码如下所示:
/*我的ext-json-grid.js代码*/
Ext.onReady(function() {
var proxy = new Ext.data.HttpProxy( {
url : 'grid.do?operator=read'
});
// 定义reader
var reader = new Ext.data.JsonReader( {
id : 'loginName'
}, [ {
name : 'loginName'
}, {
name : 'password'
}, {
name : 'type', convert : function(v) {
return v.typeName;
}
}])
// 构建Store
var store = new Ext.data.Store( {
proxy : proxy,
reader : reader
});
// 载入
store.load();
// create the grid
var grid = new Ext.grid.GridPanel( {
store : store,
columns : [ {
header : "Login Name",
width : 110,
dataIndex : 'loginName',
sortable : true
}, {
header : "Password",
width : 120,
dataIndex : 'password',
sortable : true
}, {
header : "Type",
width : 120,
dataIndex : 'type',
sortable : true
}],
renderTo : 'example-grid',
width : 540,
height : 200
});
});
html代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>register.html</title>
<link href="scripts/ext/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script src="scripts/ext/adapter/ext/ext-base.js" type="text/javascript"></script>
<script src="scripts/ext/ext-all.js" type="text/javascript"></script>
<script src="scripts/ext-json-grid.js" type="text/javascript"></script>
</head>
<body>
<div id="example-grid">
</div>
</body>
</html>
分享到:
相关推荐
通过循环构建JSON数组,然后将其写入到响应流中,以便JavaScript端能够读取。 #### 5. **总结** 通过以上分析,我们了解了在JSP中使用JSON进行数据传输的基本流程。从JavaScript端请求数据,到JSP端处理并返回JSON...
- **Ext.data.JsonReader篇**:`Ext.data.JsonReader`是专门用于解析JSON数据的类,它能够将JSON字符串转换为JavaScript对象,便于进一步处理。 - **Ext.data.HttpProxy篇**:这部分介绍了`Ext.data.HttpProxy`,它...
本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计进度条、设计工具栏和菜单栏、设计面板、设计表格、设计表单、设计数据表、...
- `reader`:设置数据读取器,如`Ext.data.JsonReader`,定义字段映射以便解析JSON响应。 3. **JSP与服务器端处理**: - JSP页面是Java服务器端脚本,负责接收EXT Grid的请求,处理数据库查询并返回JSON响应。 -...
还可以通过`getSortState`方法获取当前的排序状态,该方法返回一个包含`field`和`direction`的JSON对象。 #### 五、后台排序 如果需要在服务器端进行数据排序,可以设置`remoteSort`属性为`true`。这样做会使得`...
EXT核心API详解主要涵盖了一系列与EXT.js库相关的类和对象,EXT.js是一个强大的JavaScript UI框架,用于构建富客户端Web应用程序。以下是对各个类的详细解释: 1. **Ext类**:EXT库的基础类,提供了许多实用的方法...
本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计进度条、设计工具栏和菜单栏、设计面板、设计表格、设计表单、设计数据表、...
`JsonReader`是ExtJs中的数据读取器,它解析JSON格式的数据,并将其转化为可以供GridPanel使用的Record对象。关键配置包括: 1. `id`:指定数据行对象中包含数据行ID的属性名。 2. `totalProperty`:用于获取数据集...
3.5.2. TreeLoader外传 之 读取本地json 3.6. jsp的例子是一定要有的 3.7. 让你知道树都可以做些什么 3.7.1. 检阅树形的事件 3.7.2. 右键菜单并非单纯的事件 3.7.3. 默认图标好单调,改一下撒 3.7.4. 偷偷告诉你咋从...
文档标题和描述中提到的"etjs核心API详解"很可能是指EXT JS,这是一个基于JavaScript的富客户端应用开发框架,主要用于构建桌面级Web应用程序。EXT JS提供了丰富的组件库和数据管理功能,其核心API是框架的核心部分...
- **概述**:Ext.data.JsonReader类用于解析JSON对象格式的数据。 - **常用方法**: - `new Ext.data.JsonReader(readerConfig, recordType)`:创建一个新的JSON读取器实例。 - `Ext.data.JsonReader.read...
13. **extJs 2.0学习笔记**:这部分内容可能包含与2.1版本相关的进阶主题,如Ajax的使用、Ext.data的相关知识、Ext.Panel的深入研究、事件注册、组件总论、Element API的总结以及DomHelper和ext.js的使用方法。...
通常情况下,我们会根据返回数据的格式选择合适的读取器,比如对于JSON格式的数据,可以使用`JsonReader`。 Store还支持内联数据,即可以通过配置`data`选项直接定义数据,这在某些情况下非常方便。例如: ```...
接下来定义了一个 `JsonReader` 对象,该对象指定了JSON数据的结构,包括数据数组的名称、总记录数的属性名等。这里还设置了一个属性 `remoteSort` 为 `true`,表示排序操作将在服务器端完成。 3. **创建 Store**...
4. **配置Reader**:设置数据读取器(Reader),如`Ext.data.JsonReader`,定义如何解析服务器返回的JSON数据。 5. **绑定到GridPanel**:将PagingStore与GridPanel关联,GridPanel会根据PagingStore的数据自动渲染...
2. **Array 类**:EXTJS扩展了JavaScript的数组对象,添加了一些实用的方法,如Ext.Array.each()用于遍历数组,Ext.Array.indexOf()查找元素的索引。 3. **Number 类**:增强了JavaScript的数字处理,提供了如Ext....
- `Ext.data.JsonReader.read(response)`: 读取JSON数据。 #### 34. Ext.data.XmlReader 类 (P.27) - **概述**:读取XML格式的数据。 - **常用方法**: - `Ext.data.XmlReader.read(response)`: 读取XML数据。 ##...
- `JsonReader`是`Ext.data.Reader`的一个子类,用于解析从服务器返回的JSON格式数据。它可以将JSON数据转换为`Record`对象数组,方便`GridPanel`进行数据绑定。 3. **Store** - `Store`是ExtJS中用于存储和管理...