Ext结合DWR的关键代码（运行成功的DWRProxy）[转]

在使用Ext与DWR框架时，我们往往会用到GridPanel组件搭配PagingToolbar组件来实现翻页数据列表。翻页的时候每一页都要从后台获取该页的数据列表信息。
在解决此问题时，花了不少时间，看过不少前人的代码，终于成功了！共享之。
关键代码如下：

Store为：

 1 var  ds  =   new  Ext.data.Store( {
 2
 3     proxy:  new  Ext.data.DWRProxy( {
 4         callback: Folder.getMessageList,
 5         params:  {
 6             start: ' 0 ',
 7             limit: PAGE_SIZE
 8         }
 9     } ),
10     
11      //     proxy: new Ext.data.MemoryProxy(messageList),
12     
13     reader:  new  Ext.data.ObjectReader( {
14         root: 'messages',
15         totalProperty: 'total' // 用来让Ext的PagingToolbar组件分析总页数
16     } , [ {
17         name: 'messageId'
18     } ,  {
19         name: 'from'
20     } ,  {
21         name: 'subject'
22     } ,  {
23         name: 'sendTime'
24     } ,  {
25         name: 'contentText'
26     } ])
27
28 } );
29
30 // 在进行DWR请求之前，默认在请求参数中添加当前文件夹ID。这样DWR请求中包括的请求参数为:folderId，start，limit
31 ds.on('beforeload',  function () {
32     Ext.apply( this .baseParams,  {
33         folderId: currentFolderId
34     } );
35 } );
36
37 ds.load( {
38         params:  {
39             start: currentStart,
40             limit: currentLimit
41         }
42     } ); // 指定起始位置以及个数

自定义的DWRProxy和ObjectReader：

  1 Ext.data.DWRProxy  =   function (config) {
  2     Ext.data.DWRProxy.superclass.constructor.call( this );
  3     Ext.apply( this , config  ||
  4      {} );
  5 } ;
  6
  7 Ext.extend(Ext.data.DWRProxy, Ext.data.DataProxy,  {
  8      // DWR请求
  9     load:  function (params, reader, callback, scope, arg) {
 10         currentStart  =  params.start; // 保存当前页记录起始位置
 11         currentLimit  =  params.limit; // 保存当前页记录的个数
 12         document.dwr  =   {
 13             params: params,
 14             reader: reader,
 15             callback: callback,
 16             scope: scope,
 17             arg: arg
 18         } ;
 19          // 处理请求参数，将各个请求参数转换到Array中
 20          var  callParams  =   new  Array();
 21         callParams.push(params.folderId); // 当前文件夹ID
 22         callParams.push(params.start); // 请求的起始位置
 23         callParams.push(params.limit); // 请求的个数
 24          if  ( this .params  !==  undefined  &&   this .params  !==   null )  {
 25              this .callback.call( this , callParams,  this .loadResponse); // DWR请求
 26         }
 27          else   {
 28              this .callback.call( this ,  this .loadResponse);
 29         }
 30     } ,
 31      // 处理DWR返回
 32     loadResponse:  function (response) {
 33          var  dwr  =  document.dwr;
 34          try   {
 35              // IE throws an exception 'Error: TypeError, Object does not support this operation'   
 36              // so use try catch  to suppress this exception   
 37              delete  document.dwr; // ie不支持delete
 38         }  
 39          catch  (e)  {
 40         }
 41          var  result;
 42          try   {
 43             result  =  dwr.reader.read(response); // 读取请求返回的json
 44         }  
 45          catch  (e)  {
 46              // this.fireEvent("loadexception",this,dwr,response,e);   
 47             dwr.callback.call(dwr.scope,  null , dwr.arg,  false );
 48              return ;
 49         }
 50         dwr.callback.call(dwr.scope, result, dwr.arg,  true );
 51     } ,
 52     failure:  function (errorString, exception) {
 53         console.log( " DWR  "   +  exception);
 54     } ,
 55     update:  function (params, records) {
 56     }
 57 } );
 58
 59 // 自定义一个用于处理返回消息列表的Reader
 60 Ext.data.ObjectReader  =   function (meta, recordType) {
 61     Ext.data.ObjectReader.superclass.constructor.call( this , meta, recordType);
 62 } ;
 63
 64 Ext.extend(Ext.data.ObjectReader, Ext.data.DataReader,  {
 65      // 处理DWR返回
 66     read:  function (response) {
 67          var  responseDecode  =  Ext.util.JSON.decode(response); // 注意，由java的json-lib生成的json串需要解码一下
 68          var  data  =  responseDecode.messages;
 69          var  sid  =   this .meta  ?   this .meta.id :  null ;
 70          var  recordType  =   this .recordType, fields  =  recordType.prototype.fields;
 71          var  records  =  [];
 72          var  root  =  data;
 73          for  ( var  i  =   0 ; i  <  root.length; i ++ )  {
 74              var  obj  =  root[i];
 75              var  values  =   {} ;
 76              var  id  =  obj[sid];
 77              for  ( var  j  =   0 , jlen  =  fields.length; j  <  jlen; j ++ )  {
 78                  var  f  =  fields.items[j];
 79                  var  k  =  (f.mapping  !==  undefined  &&  f.mapping  !==   null )  ?  f.mapping : f.name;
 80                  var  v  =   null ;
 81                  var  idx  =  k.indexOf( " . " );
 82                  if  (idx  ==   - 1 )  {
 83                     v  =  obj[k]  !==  undefined  ?  obj[k] : f.defaultValue;
 84                 }
 85                  else   {
 86                      var  k1  =  k.substr( 0 , idx);
 87                      var  k2  =  k.substr(idx  +   1 );
 88                      if  (obj[k1]  ==  undefined)  {
 89                         v  =  f.defaultValue;
 90                     }
 91                      else   {
 92                          var  obj2  =  obj[k1];
 93                         v  =  obj2[k2]  !==  undefined  ?  obj2[k2] : f.defaultValue;
 94                     }
 95                 }
 96                 v  =  f.convert(v);
 97                 values[f.name]  =  v;
 98             }
 99              var  record  =   new  recordType(values, id);
100             records[records.length]  =  record;
101         }
102          return   {
103             records: records, // 返回的消息列表记录
104             totalRecords: responseDecode.total // 总个数
105         } ;
106     }
107 } );

--------------------