今天被如何解析如下复杂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是框架的核心部分...
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....
- `JsonReader`是`Ext.data.Reader`的一个子类，用于解析从服务器返回的JSON格式数据。它可以将JSON数据转换为`Record`对象数组，方便`GridPanel`进行数据绑定。 3. **Store** - `Store`是ExtJS中用于存储和管理...
例如，可以使用 `JsonReader` 将 JSON 数据转换为 Store 记录。 **7.4 Ext.data.DataWriter -- Ext.data.Store 的数据保存器** `Ext.data.DataWriter` 用于将 Store 中的数据转换为适合发送给服务器的格式。例如，...