TreeLoader扩展,支持josn-plugin返回的json对象中包含的数组值

原文地址:http://yourgame.javaeye.com/blog/477750

 

Struts2的josn插件 josn-plugin 对我们开发extjs程序很方便,但是他每次返回的数据格式都是以一个对象的方式返回的,对象中可以包含其他格式的数据,比如数组.
这就是一般的返回格式

Js代码
  1. { "root" :[{ "address" : "shenzhen" , "company" : "Bank of China" , "manager" : "true" , "name" : "Jack" , "password" : "a" , "userid" : "8ad08c8323eeb3ba0123eeb3c6e20001" , "username" : "a" , "zip" : "518000" },{ "address" : "dongjing" , "company" : "Bank of Japan" , "manager" : "false" , "name" : "Jack Cheng" , "password" : "b" , "userid" : "8ad08c8323eeb3ba0123eeb3c6e20002" , "username" : "b" , "zip" : "518000" }], "totalProperty" :2}  


struts2后台配置为

Xml代码
  1. < action   name = "getUsers"   class = "userAction"   method = "getUsers" >   
  2.      < result   type = "json" >   
  3.          < param   name = "root" >   
  4.         page   
  5.          param >   
  6.          < param   name = "excludeNullProperties" >   
  7.         true   
  8.          param >   
  9.          < param   name = "includeProperties" >   
  10.         root.*,totalProperty   
  11.          param >   
  12.      result >   
  13. action >   




而我们做树(TreePanel)的时候需要服务器返回的数据是数组对象的形式.如下

Js代码
  1. [{ "address" : "shenzhen" , "company" : "Bank of China" , "manager" : "true" , "name" : "Jack" , "password" : "a" , "userid" : "8ad08c8323eeb3ba0123eeb3c6e20001" , "username" : "a" , "zip" : "518000" },{ "address" : "dongjing" , "company" : "Bank of Japan" , "manager" : "false" , "name" : "Jack Cheng" , "password" : "b" , "userid" : "8ad08c8323eeb3ba0123eeb3c6e20002" , "username" : "b" , "zip" : "518000" }]  


但是json-plugin不支持直接返回这种格式,所以我们可以修改一下TreeLoader的处理函数

Js代码
  1. //TreeLoader扩展,支持josn-plugin返回的json对象中包含的数组值   
  2. Ext.tree.JsonPluginTreeLoader =  function  (config) {   
  3.      this .rootName =  'root' ;   
  4.     Ext.tree.JsonPluginTreeLoader.superclass.constructor.call( this , config);   
  5. }   
  6. Ext.extend(Ext.tree.JsonPluginTreeLoader, Ext.tree.TreeLoader, {   
  7.     processResponse:  function  (response, node, callback,scope) {   
  8.          var  json = response.responseText;   
  9.          try  {   
  10.              var  o = response.responseData || Ext.decode(json);   
  11. //在原代码基础上增加了下面处理---------------------   
  12.              if  (Ext.type(o) ==  'object' ) { //如果返回的是对象则获取他的root部分,rootName是可以在使用的时候配置的   
  13.                 o = o[ this .rootName ||  'root' ];   
  14.             }   
  15. //--------------------------------------------------   
  16.             node.beginUpdate();   
  17.              for  ( var  i = 0, len = o.length; i < len; i++) {   
  18.                  var  n =  this .createNode(o[i]);   
  19.                  if  (n) {   
  20.                     node.appendChild(n);   
  21.                 }   
  22.             }   
  23.             node.endUpdate();   
  24.              this .runCallback(callback, scope || node, [node]);   
  25.         }  catch (e) {   
  26.              this .handleFailure(response);   
  27.         }   
  28.     }   
  29. });  



使用方法

Js代码
  1. {   
  2.     xtype:  'treepanel' ,   
  3.     loader:  new  Ext.tree.JsonPluginTreeLoader({   
  4.         dataUrl:  'xxx.action'   
  5.          //rootName:'nodes' //这里可以动态配置,已配合服务器返回的数组名称:)   
  6.     }),   
  7.     root:  new  Ext.tree.AsyncTreeNode({   
  8.         text:  '根节点'   
  9.     })   
  10. }  



后台struts2的josn配置如下

Xml代码
  1. < action   name = "getUsers"   class = "userAction"   method = "getUsers" >   
  2.      < result   type = "json" >   
  3.          < param   name = "root" >   
  4.         page   
  5.          param >   
  6.          < param   name = "excludeNullProperties" >   
  7.         true   
  8.          param >   
  9.          < param   name = "includeProperties" >   
  10.         root.*   
  11.          param >   
  12.      result >   
  13. action >  

你可能感兴趣的:(json,扩展,manager,callback,struts,function,struts2,ext)