ExtJS中回调DWR方法

最近开始学习ExtJS,发现其与DWR之间还是存在不太协调之处,其实我的需求很简单:就是在Ext的store对象能调用DWR暴露的接口,并将数据写的STORE中。于是GOOGLE了一下,发现以下东东:  


Ext.data.DWRProxy 
=   function (fn) {
    Ext.data.DWRProxy.superclass.constructor.call(
this);
    
this.fn = fn;
}
;
Ext.extend(Ext.data.DWRProxy, Ext.data.DataProxy, 
{  
    load : 
function(params, reader, callback, scope, arg){
        params 
= params || {};       
        
if(this.fireEvent("beforeload"this, params) !== false)
        
{
            
var proxy=this;
            
this.fn(params,function(ret){
                
var result;
                
try 
                
{    
                    
                    
var o = eval("("+ret+")");
                    
//alert(o);
                    result = reader.readRecords(o);
                }
catch(e)
                
{
                    
this.fireEvent("loadexception"this, arg, null, e);
                    callback.call(scope, 
null, arg, false);
                    
return;
                }

                
//alert('call back');
                callback.call(scope, result, arg, true);
                         }
);
          
        }
   
    }


}
);

但调用时发现根本无法调用。

调用代码如下:



var  grid;
Ext.onReady(
function (){
    
    grid 
=  getRegion();
    
});


function  getRegion()
{        
    
var  store = new  Ext.data.DWRStore({        
          id:
" code " ,
          fn:ServerParserImpl.test,  
          fields:[{name:
' year ' },
              {name:
' code ' },{name: ' name ' },
              {name:
' province_shortname ' },
              {name:
' owner ' },
              {name:
' level ' },{name: ' area ' },
              {name:
' pepole ' },
              {name:
' place ' },{name: ' postcode ' },
              {name:
' recordStatus ' }]
                
          });
          
    
var  cm = new  Ext.grid.ColumnModel([
        
new  Ext.grid.RowNumberer({width: 50 }),
        {header: 
" " ,dataIndex: " year " ,sortable: true },
        {header: 
" 行政区编码 " ,dataIndex: " code " ,sortable: true },
        {header: 
" 行政区名称 " ,dataIndex: " name " ,sortable: true },
        {header: 
" 所属省份简称 " ,dataIndex: " province_shortname " ,sortable: true },
        {header: 
" 所属省份 " ,dataIndex: " owner " ,sortable: true },
        {header: 
" 级别 " ,dataIndex: " level " ,sortable: true },
        {header: 
" 面积 " ,dataIndex: " area " ,sortable: true },
        {header: 
" 人口 " ,dataIndex: " pepole " ,sortable: true },
        {header: 
" 地区 " ,dataIndex: " place " ,sortable: true },
        {header: 
" 邮编 " ,dataIndex: " postcode " ,sortable: true },
        {header: 
" 记录状态 " ,dataIndex: " recordStatus " }        
        ]);    

    
var  grid = new  Ext.grid.GridPanel({      
        store:store,
          cm:cm, 
        loadMask: {msg:
' 正在加载数据,请稍候…… ' },
        frame:
true ,        
        tbar:[{pressed:
true ,text: ' 查询 ' ,handler:query},
        {pressed:
true ,text: ' 增加 ' ,handler:add},
        {pressed:
true ,text: ' 删除 ' ,handler:remove},
        {pressed:
true ,text: ' 修改 ' ,handler:edit},
        {pressed:
true ,text: ' 保存 ' ,handler:save}]
      });     

     
new  Ext.Viewport({layout: " fit " ,items:grid});
     store.load({params:[
" str1 " ,[{year: 2008 ,code: ' 1000000 ' }], 56.90 ]});
     
return  grid;
 }

经过多方分析,需要修改DWRProxy中的load,修改如下:

Ext.data.DWRProxy  =   function (fn){
    Ext.data.DWRProxy.superclass.constructor.call(
this );
    
this .fn  =  fn;
};
Ext.extend(Ext.data.DWRProxy, Ext.data.DataProxy, {  
    load : 
function (params, reader, callback, scope, arg){
        params 
=  params  ||  {};       
        
if ( this .fireEvent( " beforeload " this , params)  !==   false )
        {
            
var  proxy = this ;
            
// dwr回调函数
              dwrcallback  =   function (ret){
                
var  result;
                
try  
                {                    
                    
var  o  =  eval( " ( " + ret + " ) " );
                    result 
=  reader.readRecords(o);
                }
catch (e)
                {
                    
this .fireEvent( " loadexception " this , arg,  null , e);
                    callback.call(scope, 
null , arg,  false );
                    
return ;
                }
                callback.call(scope, result, arg, 
true );
            }
            
// 需要将参数加入到调用参数
             var  callParams  =   new  Array();
            
for ( var  i = 0 ; i < params.length; ++ i)
            {
                callParams.push(params[i]);
            }
            
// 将回调函数加入的参数数组
            callParams.push(dwrcallback);
              
this .fn.apply( this , callParams);
        }   
    }

});

现将所有与DWR相关的EXTJS类贴出,希望能给与我一样的初学者一些帮助:

Ext.data.DWRProxy  =   function (fn){
    Ext.data.DWRProxy.superclass.constructor.call(
this );
    
this .fn  =  fn;
};
Ext.extend(Ext.data.DWRProxy, Ext.data.DataProxy, {  
    load : 
function (params, reader, callback, scope, arg){
        params 
=  params  ||  {};       
        
if ( this .fireEvent( " beforeload " this , params)  !==   false )
        {
            
var  proxy = this ;
            
// dwr回调函数
              dwrcallback  =   function (ret){
                
var  result;
                
try  
                {                    
                    
var  o  =  eval( " ( " + ret + " ) " );
                    result 
=  reader.readRecords(o);
                }
catch (e)
                {
                    
this .fireEvent( " loadexception " this , arg,  null , e);
                    callback.call(scope, 
null , arg,  false );
                    
return ;
                }
                callback.call(scope, result, arg, 
true );
            }
            
// 需要将参数加入到调用参数
             var  callParams  =   new  Array();
            
for ( var  i = 0 ; i < params.length; ++ i)
            {
                callParams.push(params[i]);
            }
            
// 将回调函数加入的参数数组
            callParams.push(dwrcallback);
              
this .fn.apply( this , callParams);
        }   
    }

});

/* *
* Ext.data.DWRStore实现对DWR调用后返回的记录进行存储
*    当调用的DWR方法返回的是JSON对象时,使用此存储类进行管理
*/
Ext.data.DWRStore 
=   function (c){
    Ext.data.DWRStore.superclass.constructor.call(
this , Ext.apply(c, {
        proxy: c.fn 
?   new  Ext.data.DWRProxy(c.fn): undefined,
        reader: c.reader 
?  c.reader :  new  Ext.data.JsonReader(c, c.fields)
    }));
};
Ext.extend(Ext.data.DWRStore, Ext.data.Store);

 后台JAVA方法定义:public String test(String str1,List lst,Double dbvalue){return "[{year:2008}]"}

你可能感兴趣的:(js,extjs,header,function,dwr,callback,null)