我们非常高兴的宣布,EasyJWeb-1.1今日正式对外发布,这个版本主要对EasyJWeb的Ajax支持作较大的改进。主要包括下面的内容:
1、在EasyJWeb Tools中增加了一套Rich Component组件,可以与其它客户端Ajax框架比如ExtJS等集成开发RIA应用。
2、修改了远程脚本调用引擎,使得性能比上一版本前提升了近2倍,详见http://www.easyjf.com/blog/html/20080103/1015816.html;
3、多国语言功能增加了对 xml格式属性文件的支持,http://jira.easyjf.com/browse/EASYJWEB-33。
4、增加从服务器输入JSon数据对象的快捷支持。
5、提供了更多的EastJWeb实例应用,详见http://easyjweb.demo.easyjf.com/。
6、修正了这两个月来大家提出的Bug及调整了一些功能,详细见jira.easyjf.com。
7、完善了入门文档,详见wiki.easyjf.com。
源码下载:ftp://ftp1.easyjf.com/easyjweb/easyjweb-1.1/easyjweb-1.1.zip
在线示例:http://easyjweb.demo.easyjf.com
在线文档:http://wiki.easyjf.com/display/wiki/EasyJWeb
这里对Rich Component及Ajax改进作简单介绍。
一、EasyJWeb Rich Component
EasyJWeb 1.1版提供了一套富客户端组件,也就是Rich Componet,可以用来与ExtJS等配合快速开发出基于Ajax的RIA应用。不再需要写烦琐的javascript,直接用java就能写出漂亮的基于ExtJS等客户端框架的Ajax应用,详见示例http://wlr2.easyjf.com/。
比如只需要下面的Action代码:
访问simple.ejf?cmd=grid将会得到一个非常漂亮的表格:
访问simple.ejf?cmd=tree将会得到一个还不错的树:
如何实现一个添删改查、分页呢?看下面的代码:
访问simple.ejf?cmd=crud将会得到一个添删改查及分页的界面,点击“添加”、“修改”、“删除”、“刷新”等按钮可以执行相应的操作,如下图所示:
二、其它Ajax支持的改进及完善
1、在以前EasyJWeb的Ajax支持引擎基础上,对远程脚本调用引擎中的脚本engine.js作了调整,使得回调函数可以选择作用域scope。
服务器业务组件:
Bean配置文件:
客户端读取服务器端时间的代码:
PersonService.getTime(callback);//没有使用作用域
PersonService.getTime(callback,new o());//回调函数在o实例作用域中使用域
PersonService.getTime(callback,window);//回调函数在window作用域中执行
2、增加向客户端输出JSon对象数据的快速方法。
客户端可以这样使用:
1、在EasyJWeb Tools中增加了一套Rich Component组件,可以与其它客户端Ajax框架比如ExtJS等集成开发RIA应用。
2、修改了远程脚本调用引擎,使得性能比上一版本前提升了近2倍,详见http://www.easyjf.com/blog/html/20080103/1015816.html;
3、多国语言功能增加了对 xml格式属性文件的支持,http://jira.easyjf.com/browse/EASYJWEB-33。
4、增加从服务器输入JSon数据对象的快捷支持。
5、提供了更多的EastJWeb实例应用,详见http://easyjweb.demo.easyjf.com/。
6、修正了这两个月来大家提出的Bug及调整了一些功能,详细见jira.easyjf.com。
7、完善了入门文档,详见wiki.easyjf.com。
源码下载:ftp://ftp1.easyjf.com/easyjweb/easyjweb-1.1/easyjweb-1.1.zip
在线示例:http://easyjweb.demo.easyjf.com
在线文档:http://wiki.easyjf.com/display/wiki/EasyJWeb
这里对Rich Component及Ajax改进作简单介绍。
一、EasyJWeb Rich Component
EasyJWeb 1.1版提供了一套富客户端组件,也就是Rich Componet,可以用来与ExtJS等配合快速开发出基于Ajax的RIA应用。不再需要写烦琐的javascript,直接用java就能写出漂亮的基于ExtJS等客户端框架的Ajax应用,详见示例http://wlr2.easyjf.com/。
比如只需要下面的Action代码:
- public class SimpleAction extends RichComponentAction {
- public Page doGrid() {
- ViewPort view = new ViewPort();
- GridPanel grid = new GridPanel("grid", "数据表格",500,100);
- grid.setColumns(new String[]{"id","姓名","出生日期","email"}); view.add(grid);
- this.addComponent(view);
- return componentPage;
- }
- }
public class SimpleAction extends RichComponentAction {
public Page doGrid() {
ViewPort view = new ViewPort();
GridPanel grid = new GridPanel("grid", "数据表格",500,100);
grid.setColumns(new String[]{"id","姓名","出生日期","email"}); view.add(grid);
this.addComponent(view);
return componentPage;
}
}
访问simple.ejf?cmd=grid将会得到一个非常漂亮的表格:
- public Page doTree() {
- ViewPort view = new ViewPort();
- TreePanel tree=new TreePanel("tree","简单的树",200);
- TreeNode root=new TreeNode("root","根");
- root.add(new TreeNode("c1","孩子1"));
- root.add(new TreeNode("c2","孩子2"));
- root.getChildNodes().get(1).add(new TreeNode("c3","孙子"));
- tree.setRoot(root);
- view.add(tree);
- this.addComponent(view);
- return componentPage;
- }
public Page doTree() {
ViewPort view = new ViewPort();
TreePanel tree=new TreePanel("tree","简单的树",200);
TreeNode root=new TreeNode("root","根");
root.add(new TreeNode("c1","孩子1"));
root.add(new TreeNode("c2","孩子2"));
root.getChildNodes().get(1).add(new TreeNode("c3","孙子"));
tree.setRoot(root);
view.add(tree);
this.addComponent(view);
return componentPage;
}
访问simple.ejf?cmd=tree将会得到一个还不错的树:
如何实现一个添删改查、分页呢?看下面的代码:
- public Page doCrud() {
- ViewPort view = new ViewPort("fit");
- CrudPanel crud = new SimpleCrud();
- view.add(crud);
- this.addComponents(view);
- return componentPage;
- }
- public class SimpleCrud extends CrudPanel {
- public SimpleCrud() {
- super("test", "简单测试", "link.ejf");
- this.setColumns(new String[][] { { "title", "名称" },{ "url", "网址" },
- { "rss", "RSS" } });
- this.getPagingToolbar().setDisplayInfo(true);
- this.getGrid().load();
- }
- @Override
- public Function getCreateWin() {
- return new Function("return this.initWin(438,300,'连接管理');");
- }
- @Override
- public Form getForm() {
- Form f = new Form();
- f.add(new TextField("title", "主题"));
- f.setLazy(false);
- return f;
- }
- }
public Page doCrud() {
ViewPort view = new ViewPort("fit");
CrudPanel crud = new SimpleCrud();
view.add(crud);
this.addComponents(view);
return componentPage;
}
public class SimpleCrud extends CrudPanel {
public SimpleCrud() {
super("test", "简单测试", "link.ejf");
this.setColumns(new String[][] { { "title", "名称" },{ "url", "网址" },
{ "rss", "RSS" } });
this.getPagingToolbar().setDisplayInfo(true);
this.getGrid().load();
}
@Override
public Function getCreateWin() {
return new Function("return this.initWin(438,300,'连接管理');");
}
@Override
public Form. getForm() {
Form. f = new Form();
f.add(new TextField("title", "主题"));
f.setLazy(false);
return f;
}
}
访问simple.ejf?cmd=crud将会得到一个添删改查及分页的界面,点击“添加”、“修改”、“删除”、“刷新”等按钮可以执行相应的操作,如下图所示:
二、其它Ajax支持的改进及完善
1、在以前EasyJWeb的Ajax支持引擎基础上,对远程脚本调用引擎中的脚本engine.js作了调整,使得回调函数可以选择作用域scope。
服务器业务组件:
- public class PersonServiceImpl {
- /**
- * 得到服务器当前时间
- * @return
- */
- public Date getTime() {
- return new Date();
- }
- }
public class PersonServiceImpl {
/**
* 得到服务器当前时间
* @return
*/
public Date getTime() {
return new Date();
}
}
Bean配置文件:
- "PersonService" class="easyjweb.demo.service.impl.PersonServiceImpl" />
在javascript中调用:
- var s="作用域2";
- var o=new function()
- {
- this.s="作用域1";
- }
- function callback(d)
- {
- alert("服务器时间:"+d);
- alert(this.test);
- }
var s="作用域2";
var o=new function()
{
this.s="作用域1";
}
function callback(d)
{
alert("服务器时间:"+d);
alert(this.test);
}
客户端读取服务器端时间的代码:
PersonService.getTime(callback);//没有使用作用域
PersonService.getTime(callback,new o());//回调函数在o实例作用域中使用域
PersonService.getTime(callback,window);//回调函数在window作用域中执行
2、增加向客户端输出JSon对象数据的快速方法。
- public Page doList(WebForm form) {
- QueryObject qo = form.toPo(QueryObject.class);
- IPageList pageList = service.getLinkBy(qo);
- form.jsonResult(pageList);
- return Page.JSONPage;
- }
public Page doList(WebForm. form) {
QueryObject qo = form.toPo(QueryObject.class);
IPageList pageList = service.getLinkBy(qo);
form.jsonResult(pageList);
return Page.JSONPage;
}
上面的代码实现把服务器端的pageList对象转换成JSON数据对象,并给客户端返回这个JSon数据对象。
客户端可以这样使用:
- var s=eval(req.responseText);
- alert(s.rowCount);
- for(var i=0;ialert(s.result[i].title);
var s=eval(req.responseText);
alert(s.rowCount);
for(var i=0;ialert(s.result[i].title);
3、另外还对表单ajax提交等作了其它一些调整,详细请参考最新的api文档。
来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/11310314/viewspace-181498/,如需转载,请注明出处,否则将追究法律责任。
转载于:http://blog.itpub.net/11310314/viewspace-181498/