ExtJs 在Web UI已经获得很大的殊荣,但单凭借它 Client UI 还无法霸占BS 那么丰富的应用。。他还要选择 一个Web层与后台一起来交互完成一个完美的系统。
Extjs的天生丽质的, 完美了融合JQuery,Prototype,YUI, 和她结合当然也需要出类拔萃,生出名门。 如果采用Java为开发主语言,那么 ExtJS + DWR + SPRING 算是门当户对。
可惜Extjs 的DataStore 的 prxy 并没有DWR一席,因为DWR返回的是Java对象与JSON非常像, 然而DWR 的在于它与Web远程Java方法的直接会话,因此有着非常灵活的一面。所以,有时候使用DWR对于J2EE来说,要更好于JSON,他做了JSON做不到事.
extjs官方论坛里已经有人编写了这样的扩展,后经人丰富,现在基本能满足要求了。
DWR扩展代码如下,创建 Ext.data.DWRProxy类。同样也继承Ext.data.DataProxy ,拿来show着解读一下。
dwr.js
Ext.data.DWRProxy = function(dwrCall, pagingAndSort){
Ext.data.DWRProxy.superclass.constructor.call(this);
this.dwrCall = dwrCall;
//this.args = args;
this.pagingAndSort = (pagingAndSort!=undefined ? pagingAndSort : true);
};
Ext.extend(Ext.data.DWRProxy, Ext.data.DataProxy, {
load : function(params, reader, callback, scope, arg) {
if(this.fireEvent("beforeload", this, params) !== false) {
var sort;
if(params.sort && params.dir) sort = params.sort + ' ' + params.dir;
else sort = '';
var delegate = this.loadResponse.createDelegate(this, [reader, callback, scope, arg], 1);
var callParams = new Array();
if(arg.arg) {
callParams = arg.arg.slice();
}
if(this.pagingAndSort) {
callParams.push(params.start);
callParams.push(params.limit);
callParams.push(sort);
}
callParams.push(delegate);
this.dwrCall.apply(this, callParams);
} else {
callback.call(scope || this, null, arg, false);
}
},
loadResponse : function(listRange, reader, callback, scope, arg) {
var result;
try {
result = reader.read(listRange);
} catch(e) {
this.fireEvent("loadexception", this, null, response, e);
callback.call(scope, null, arg, false);
return;
}
callback.call(scope, result, arg, true);
},
update : function(dataSet){},
updateResponse : function(dataSet)
{}
});
Ext.data.ListRangeReader = function(meta, recordType){
Ext.data.ListRangeReader.superclass.constructor.call(this, meta, recordType);
this.recordType = recordType;
};
Ext.extend(Ext.data.ListRangeReader, Ext.data.DataReader, {
getJsonAccessor: function(){
var re = /[\[\.]/;
return function(expr) {
try {
return(re.test(expr))
? new Function("obj", "return obj." + expr)
: function(obj){
return obj[expr];
};
} catch(e){}
return Ext.emptyFn;
};
}(),
read : function(o){
var recordType = this.recordType, fields = recordType.prototype.fields;
//Generate extraction functions for the totalProperty, the root, the id, and for each field
if (!this.ef) {
if(this.meta.totalProperty) {
this.getTotal = this.getJsonAccessor(this.meta.totalProperty);
}
if(this.meta.successProperty) {
this.getSuccess = this.getJsonAccessor(this.meta.successProperty);
}
if (this.meta.id) {
var g = this.getJsonAccessor(this.meta.id);
this.getId = function(rec) {
var r = g(rec);
return (r === undefined || r === "") ? null : r;
};
} else {
this.getId = function(){return null;};
}
this.ef = [];
for(var i = 0; i < fields.length; i++){
f = fields.items[i];
var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
this.ef[i] = this.getJsonAccessor(map);
}
}
var records = [];
var root = o.data, c = root.length, totalRecords = c, success = true;
if(this.meta.totalProperty){
var v = parseInt(this.getTotal(o), 10);
if(!isNaN(v)){
totalRecords = v;
}
}
if(this.meta.successProperty){
var v = this.getSuccess(o);
if(v === false || v === 'false'){
success = false;
}
}
for(var i = 0; i < c; i++){
var n = root[i];
var values = {};
var id = this.getId(n);
for(var j = 0; j < fields.length; j++){
f = fields.items[j];
var v = this.ef[j](n);
values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue);
}
var record = new recordType(values, id);
records[i] = record;
}
return {
success : success,
records : records,
totalRecords : totalRecords
};
}
});
经过改造之后,那么DWR可以像JSON一样,返回的数据作为DataStore
代码片断
ds = new Ext.data.Store({
proxy: new Ext.data.DWRProxy(TodoService.getItems, true), //TotoService.getItems dwr开放出来的Java获取数据方法
reader: new Ext.data.ListRangeReader(
{id:'id', totalProperty:'totalSize'}, recordType),
remoteSort: true
});
Spring实现了强大的管理了后台的JavaBean,干干净净的注入创建了每个对象, DWR天生又是支持Spring,无缝的讲Spring的后台Bean 发布到Web层作为JavaScript对象,和JavaScript方法。中途不需要人工干预写Servlet.
不多说了, 跑了下代码,通过,可以直接下载。
download/ext-dwr-spring.rar
分享到:
相关推荐
2. **配置DWR**: 在Spring的配置文件中配置DWR,例如创建一个名为`dwrContext.xml`的文件,声明DWR的相关bean。主要配置包括DWR引擎(`dwrEngine`)、DWR配置(`dwrConfig`)以及DWR过滤器(`dwrFilter`)。 ```xml ...
标题 "DWR与SPRING 集成" 涉及到的是两个在Web开发中常用的开源框架——Direct Web Remoting (DWR) 和 Spring。DWR允许在浏览器和服务器之间进行实时、异步的数据交换,而Spring是Java企业级应用的全面解决方案,...
xjs dwr spring 强强联姻 博文链接:https://lib.iteye.com/blog/150208
在IT领域,Spring框架和Direct Web Remoting (DWR)是两种重要的技术,它们在构建分布式Web应用程序中发挥着关键作用。本篇文章将详细讲解如何利用Spring与DWR结合,实现一个基本的功能:判断用户名是否已经存在于...
《疯狂Ajax讲义:Prototype/jQuery+DWR+Spring+Hibernate整合开发》是《基于J2EE的Ajax宝典》的第二版。《基于J2EE的Ajax宝典》面市近2年,作为Ajax领域最全面、实用的图书,一直深受读者的好评。全书主要分为三个...
在本教程中,我们将探讨如何利用Direct Web Remoting (DWR) 和Spring框架来实现这样的功能。 DWR是一个开源Java库,它允许Web应用程序在浏览器和服务器之间进行实时的、异步的通信,类似于Ajax的功能,但更加强大。...
1. **配置DWR Spring集成**:在Spring配置文件中定义DWR相关的bean,如`DWRConfig`和`SpringContextUtil`,以便让DWR能够访问Spring的bean。 2. **Spring托管的Java类暴露给JavaScript**:通过Spring的`@Service`或...
要将DWR与Spring整合,我们通常会使用Spring的`DwrController`或者自定义一个Spring MVC控制器来处理DWR请求。此外,我们还需要在Spring的配置文件中声明DWR的相关bean,如`DwrConfig`,并将其与其他Spring服务(如...
将DWR与Spring整合,可以利用Spring的强大功能来管理和配置DWR组件,同时保持前后端交互的高效性。 在使用DWR和Spring结合时,注解方式的引入极大地简化了配置过程。下面将详细介绍如何通过注解实现DWR和Spring的...
**DWR(Direct Web Remoting)与Spring框架的整合** DWR是一款开源的Java库,它允许在浏览器和服务器之间进行动态、实时的双向通信,实现了JavaScript与Java之间的远程调用。Spring则是一个广泛使用的Java企业级...
【文具申请系统 Extjs Dwr Spring 实现】 在IT领域,开发企业级应用程序时,通常需要使用到各种技术和框架来提高效率、增强用户体验并确保系统的可维护性。本项目"文具申请系统"就是一个这样的实例,它巧妙地融合了...
### dwr与spring集成的方式 #### 一、引言 DWR(Direct Web Remoting)是一种简化Ajax开发的Java框架,允许在客户端直接调用服务器端的Java方法,从而简化了传统的JavaScript编程复杂度。Spring作为一款流行的企业...
**DWR(Direct Web Remoting)与Spring框架的集成配置** DWR(Direct Web Remoting)是一个开源的Java库,允许在Web应用程序中实现Ajax功能,使得JavaScript可以直接调用服务器端的Java方法,实现了浏览器与服务器...
### DWR与Spring整合及其应用步骤详解 #### 一、DWR与Spring整合概述 DWR(Direct Web Remoting)是一种简化Ajax应用开发的技术,它可以让JavaScript直接调用服务器端的Java方法,从而大大简化了客户端与服务器端...
将DWR与Spring结合使用,可以构建出更高效、更灵活的Web应用。 在这个例子中,我们将会探讨如何将DWR与Spring集成,创建一个可运行的示例。首先,我们需要在项目中添加DWR和Spring的相关依赖。这通常通过Maven或...
《DWR+Spring+Hibernate整合应用详解》 在IT领域,DWR(Direct Web Remoting)、Spring和Hibernate是三个至关重要的技术组件,它们分别在Web应用程序的远程调用、依赖注入和对象关系映射方面发挥着核心作用。将这三...
本话题主要关注如何通过注解方式集成EXT、DWR、Spring和Hibernate四个组件,构建一个高效的数据展示和交互的Web应用程序。 首先,EXT(Ext JS)是一个JavaScript库,用于构建用户界面,尤其适合创建富互联网应用...