学习Ext4.2的MVC有半个月了,感觉进展缓慢,一方面是资料比较少,另一方面主要还是比较懒,加上工作上暂时也没这方面需求。Ext真是个不错的Web前端框架,就凭他自成体系,把js从头到脚包装一遍花的力气,也让人赞叹(当然好不好用是另外一回事)。所谓重量级可不是吹的。
虽然进度比较慢,还是有点小心得,记录下来。
Ext.data.writer的类型不是json就是xml等,有时候与我的要求不符,因为有时候post到后台的我要求的不是纯json,例如我经常这么干:
@Action(value = "userAction")
public class UserAction extends BaseAction {
private String jsonStr = null;
public void setJsonStr(String jsonStr) {
this.jsonStr = jsonStr;
}
public void changepassword(){
User u = new User();
u = JSON.parseObject(jsonStr,User.class);
//.......
}
}
这样在一些场合非常方便,那么这时候就不能用
writer : {
type : 'json'
}
这种方式了,因为传回数据应该是 "jsonStr={json}",这时候可以自定义writer
Ext.define('Ext.data.writer.SinglePost', {
extend: 'Ext.data.writer.Writer',
alternateClassName: 'Ext.data.SinglePostWriter',
alias: 'writer.singlepost',
writeRecords: function(request, data) {
request.params['jsonStr'] = Ext.JSON.encode(data[0]);
return request;
}
});
注意,这里需要把data[0]变成json,如此就可以方便的实现自定义
自定义writer给编码提供了很大自由度(尤其是在MVC中),使用如下
Ext.define('PJ.store.UserInfo',{
extend : 'Ext.data.Store',
model : 'PJ.model.UserInfo',
autoLoad : false,
autoSync : false,
proxy : {
type : 'ajax',
api : {
read : '/sshe/userAction!userlist.action',
//create
update : '/sshe/userAction!changepassword.action'
//destroy
},
reader: {
root : 'obj',
type: 'json',
successProperty: 'success'
},
writer : {
type : 'Singlepost'
}
}
});
分享到:
相关推荐
在压缩包中的`ext-4.2.1.883`文件可能包含了ExtJS 4.2.1的源代码和资源文件,这将有助于你深入研究每个组件的内部工作原理,调试代码,甚至自定义和扩展框架功能。通过结合书籍内容和源码学习,将能更全面地掌握...
7.3.4 格式化提交数据:ext.data.writer.writer、ext.data.writer.json和ext.data. writer.xml / 322 7.3.5 writer对象的配置项 / 325 7.4 数据模型 / 326 7.4.1 概述 / 326 7.4.2 数据类型及排序类型:ext....
这部分介绍了Ext.data模块的基础,包括DataModel、Reader和Writer,是理解数据绑定和数据管理的关键。 15. **extJs 2.0 学习笔记(Ext.Panel终结篇)** Panel是构建UI的基本组件,涵盖了布局、标题、工具栏等多种...
**Ext.data**是Extjs框架中的核心组件之一,负责处理数据的加载、存储、转换以及与后端服务器之间的通信。它提供了一系列用于管理数据的类,包括Store、Reader、Writer、Proxy等。这些类共同协作,使得开发者能够...
require ( [ 'Ext.data.Model' , 'Ext.data.reader.Json' , 'Ext.data.writer.Json' , "Ext.data.proxy.Memory" ] ) ; Ext . define ( "Mock" , { extend : "Ext.data.Model" , fields : [ 'name' ] , proxy : {...
- **`store`**: 数据源,通过 `Ext.data.Store` 类定义。`GridPanel` 必须绑定一个数据存储器来提供数据支持。 - **`autoExpandColumn`**: 指定某列自动扩展宽度,通常设置为需要显示较多文本的列的索引值。 - **...
此外,EXT JS还提供了许多其他组件和服务来辅助CRUD操作,例如`Ext.MessageBox`用于提示用户确认操作,`Ext.data.Model`定义了数据模型,`Ext.data.reader.Json`和`Ext.data.writer.Json`用于JSON数据的序列化和反...
同时,需要在EXTJS4中设置适当的proxy,如Ajax proxy,指定URL到STRUTS2 ACTION,并定义对应的读者(reader)和写入者(writer)来处理数据的序列化和反序列化。 这个例子为初学者提供了一个很好的起点,了解EXTJS4...
6. **远程数据交互**:使用Ajax或SOAP与服务器进行数据交换,通过Proxy配置实现CRUD操作,并利用Ext.data.reader和Ext.data.writer解析和序列化数据。 7. **表单处理**:掌握表单组件的用法,如TextField、ComboBox...
在EXTJS中,action类通常指的是Ext.Ajax或Ext.data.proxy.Ajax,它们负责发送异步请求到服务器并处理响应。 在EXTJS4.0中,action类是用来定义与服务器的通信模式,包括GET、POST、PUT、DELETE等HTTP方法。这些操作...
同时,需要确保数据源(通常是`Ext.data.Store`)支持分页,如设置`proxy`的`reader`和`writer`来处理分页请求。 3. **选中状态管理**: GridPanel的行选中状态通常由`selModel`配置。可以设置为`Ext.selection....
它封装了XMLHttpRequest对象,提供了如Ajax请求(Ext.Ajax.request)、数据读取(Ext.data.reader)和数据写入(Ext.data.writer)等功能。 5. **数据存储与数据绑定**:ExtJS的数据模型(Model)和数据存储(Store...
ExtJS 3.0是一款基于JavaScript的开源UI框架,用于构建富互联网应用程序(RIA)。它提供了丰富的组件库,包括表格、窗体、菜单、工具栏、树形视图等,使得开发者可以创建出功能强大、界面友好的Web应用。本文将深入...
- **Data Binding**:通过Ext.data.Binding类实现,确保UI组件和数据之间的同步。 4. **CRUD操作** - **创建**:通过Form Panel收集用户输入,然后使用Store的`add()`方法添加新记录,最后调用`sync()`方法将新...
3. 数据绑定(Data Binding):通过Store和Model,ExtJS 3实现了数据和视图之间的双向绑定,使UI能够实时反映数据变化。 二、组件体系 1. 表格(Grid):ExtJS 3的表格组件支持多列、排序、分页、过滤等功能,并能...
Ext开发指南是一本专注于介绍如何使用ExtJS框架进行Web应用程序开发的专业资料。ExtJS是一个流行的JavaScript库,用于构建用户界面,特别是企业级的富互联网应用(RIA)。它提供了丰富的组件库,包括表格、树形视图...
6. **数据视图(Data Views)**:除了表格,ExtJS还支持各种自定义的数据视图,如列表(List)、详细信息视图(Detail View)等。这将帮助你创建更具视觉吸引力的界面。 7. **Ajax和JSON**:理解如何利用ExtJS的...
Data Store、Proxy和Reader/Writer等组件负责数据的加载、存储和转换。 3. **布局管理**:ExtJS提供了多种布局模式,如Fit布局、Table布局、Border布局、Form布局等,可以满足不同UI布局需求。 4. **事件处理**:...
- **Ext Core**: ExtJs 的核心库,提供了 DOM 操作、事件处理、动画效果等基础功能。 - **Components**: ExtJs 的组件模型,允许开发者创建复杂的 UI 组件,如按钮、面板、窗口等。 - **Layouts**: 布局系统,...
4. **数据包**(Data Package):包含 Store、Model、Proxy 和 Reader/Writer,用于高效地处理和展示数据。 5. **ExtJS CMD**:命令行工具用于构建、打包和优化应用程序,提高开发效率。 6. **Modern Toolkit 和 ...