远-方的博客

dojo中关于tree更新的问题

 

前阶段在搞dojo中的tree是发现一个问题，当我把tree的store写死在页面上tree的控件里，当我更新完tree刷新页面时，tree并没有发生变化

Java代码 复制代码
  1. <div dojoType="dojo.data.JsonItemStore" jsId="account"  
  2.               url="/Fiscal/initAccountTreeAction.action"></div>   
  3.        <div dojoType="dijit.Tree" id=tree store="account" query="{type:'continent'}"  
  4.               labelAttr="name" typeAttr="type"></div>  

从代码中可以看到，tree的数据来源是通过自定义initAccountTreeAction中返回的数据得到的，这个Action代码如下

Java代码 复制代码
  1. package com.sanfang.fiscal.action.account;   
  2.   
  3. import java.io.IOException;   
  4. import java.util.ArrayList;   
  5. import java.util.List;   
  6. import java.util.Map;   
  7.   
  8. import org.apache.struts2.ServletActionContext;   
  9.   
  10. import com.opensymphony.xwork2.ActionContext;   
  11. import com.opensymphony.xwork2.ActionSupport;   
  12. import com.sanfang.fiscal.business.interfaces.IBusinessDelegate;   
  13. import com.sanfang.fiscal.util.AjaxUtil;   
  14.   
  15. public class AccountTreeAction extends ActionSupport {   
  16.        
  17.     private static final long serialVersionUID = 1L;   
  18.     private IBusinessDelegate businessDelegate;   
  19.     private String mark;   
  20.        
  21.     private AjaxUtil ajaxUtil;   
  22.        
  23.     public String getMark() {   
  24.         return mark;   
  25.     }   
  26.   
  27.     public void setMark(String mark) {   
  28.         this.mark = mark;   
  29.     }   
  30.   
  31.     public AjaxUtil getAjaxUtil() {   
  32.         return ajaxUtil;   
  33.     }   
  34.   
  35.     public void setAjaxUtil(AjaxUtil ajaxUtil) {   
  36.         this.ajaxUtil = ajaxUtil;   
  37.     }   
  38.   
  39.     public IBusinessDelegate getBusinessDelegate() {   
  40.         return businessDelegate;   
  41.     }   
  42.   
  43.     public void setBusinessDelegate(IBusinessDelegate businessDelegate) {   
  44.         this.businessDelegate = businessDelegate;   
  45.     }   
  46.   
  47.     public String initAccountTree() throws IOException{   
  48.         Map session = ActionContext.getContext().getSession();   
  49.         ServletActionContext.getResponse().setContentType("text/json; charset=UTF-8");    
  50.         String language = (String)session.get("language");   
  51.         String fiscalSetID = (String)session.get("fiscalSetID");   
  52.         List<String> accountSetList = new ArrayList<String>();   
  53.         if("all".equals(mark)){   
  54.             accountSetList = businessDelegate.findAccountSetIDIsUsedByFiscalSetID(fiscalSetID, null, null);   
  55.         }else if("isSettleAcct".equals(mark)){   
  56.             accountSetList = businessDelegate.findAccountSetIDIsUsedByFiscalSetID(fiscalSetID, true, null);   
  57.         }else if("isUserObjAcct".equals(mark)){   
  58.             accountSetList = businessDelegate.findAccountSetIDIsUsedByFiscalSetID(fiscalSetID, null, true);   
  59.         }   
  60.            
  61.         String result = ajaxUtil.AccountListToTreeJSON(language, fiscalSetID, accountSetList);   
  62.         ServletActionContext.getResponse().getWriter().write(result);   
  63.            
  64.         return null;   
  65.     }   
  66.        
  67. }  

 

可以看到是通过response动态写到页面上的，可以这样有一个问题，每当动态改变了tree后（比如增加删除子节点），tree的store并没有直接在页面中重新更新加载进来。

没办法，只能在去研究tree,后发现利用tree的动态创建加上用dojo异部调用函数dojo.xhrGet可以解决这个不更新的问题, 具体代码如下:

Java代码 复制代码
  1. //把数据转换为符合tree的store格式的方法   
  2. function strToObj(json){   
  3.             return eval("("+json+")");    
  4. }   
  5.       
  6.      function init(response){   
  7.          //先创建tree的store的显示数据   
  8.     var data = strToObj(response);   
  9.     //创建store   
  10.     var store1 = new dojo.data.ItemFileReadStore({data:data});   
  11.         //创建tree,这是的tree数据是动态创建出来的，同时tree也是动态的   
  12.         var _tree=new dijit.Tree({   
  13.         label:"Accounting",   
  14.         store:store1,   
  15.         query:{type:'continent'},   
  16.         labelAttr:"name",   
  17.         typeAttr:"type",   
  18.         preventCache:true  
  19.         },   
  20.         dojo.byId('tree'));   
  21.     dojo.subscribe("tree", null, treeHandler);   
  22.        
  23.     }   
  24.        
  25.     function test(){   
  26.         //采用异步调用，目的是时时更新tree的store   
  27.         dojo.xhrGet({   
  28.         url: '/Fiscal/initAccountTreeAction.action',   
  29.         method: 'POST',   
  30.         load: function(response, ioArgs) {   
  31.             //此处的resonse就是从Action得到的数据   
  32.             init(response);   
  33.         },   
  34.         preventCache: true,   
  35.         content: {mark:'all'}   
  36.          });   
  37.     }   
  38.        
  39.     //每次刷新页面都调用test方法   
  40.     dojo.addOnLoad(test);  

  当然在页面里也是要定义tree控件的，但只要简单定一个div就可以了，具体Tree的格式问题可以参考Demo里test文件夹里面关于tree store格式的资料。

Java代码 复制代码
  1. <div id="tree"></div>  

 

posted on 2009-11-15 09:29  远-方  阅读(941)  评论(0)  编辑  收藏  举报

导航