简体中文
会员名称: 登入密码: [Register] 注册 忘记密码 启用我的帐号
 
[转]初步搭建yui-ext(Ajax)的开发环境(第一部分:后台->前台数据交换)  XML
论坛首页 »项目开发» B/S开发
发表人 内容
pinke

[Avatar]

注册时间: 2006-11-18 22:27:35
文章: 919
离线
性别: 男
出生:1982-06-18


初步搭建yui-ext(Ajax)的开发环境(第一部分:后台->前台数据交换)


如果看过yui-ext的例子,相信大家很想把它用在实际项目中去,我这两个星期都在研究它,国内几乎没有资料,只能从http://www.jackslocum.com的论坛找,我现在简单介绍一下我的实际开发环境:

我的项目原来的开发环境是Struts+Spring1.2.8+Hibernate3.1.2,现在要把页面的jsp+jstl,和Struts的Action转换成yui-ext的Ajax页面,简单实现数据列表、翻页和添加、修改、删除等功能。

1. 数据交换,要从Struts环境的Action通过request对象传递数据给jsp页面,如果用Ajax,比较常用的是XML转换和Json转换,我选择了Json,因为用json-lib包可以在java端用很方便的把对象转换成Json格式,在页面可以调用脚本eval()转换成javascript的数组对象。

1) json-lib转换java对象(下载json-lib:http://json-lib.sourceforge.net)
Action例子:(example.do)代码中加入:

简单说明:把action的return mapping改成null,因为现在使用response对象进行数据传递,fromObject(list)中的list包括就是页面需要调用显示的数据,可以是其他java对象,String、bean或Map。

2) JSONDataModel调用Action(example.do)
yui-ext通过JSONDataModel.js把json格式转换成javascript的数组对象
js例子:


说明:schema的root参数要和action传递的json数据头list对应,这里new JSONDataModel后,JSONDataModel会把example.do返回的json数据转换成dataModel的数组,JSONDataModel继承于LoadableDataModel,JSONDataModel只复杂转换json数据,其他由继承的类实现,这是yui-ext的特点,你可以自己写DataModel继承父类,转换自己的数据格式,yui-ext提供了JSONDataModel和XMLDataModel两种数据格式转换。

3) 使用grid显示dataModel数据
js例子:

jsp页面例子:
说明:colModel的使用看example,grid绑定dataModel后,在页面的<Div>显示grid。

享我所想,乐你所乐
[MSN] Tencent QQ:44020567
 
论坛首页 »项目开发» B/S开发
前往:   
Powered by JForum 2.1.8 © JForum Team Template: Trydone