`
qinjingkai
  • 浏览: 259851 次
  • 性别: Icon_minigender_1
  • 来自: 广州
文章分类
社区版块
存档分类
最新评论

困惑已久的Ext中树的异步加载问题终于解决了

EXTJavaScriptCSSJSPjson 
阅读更多

    如题目所说，被这个问题困惑了很长时间；问题说来其实也很简单，就是在加载一棵树的时候不是马上加载所有节点的信息只是加载他的孩子节点的；由于之前用Ext中的树时候都是一次性加载的，所以遇到这个问题的时候，研究了一段时间，终于解决了；解决的过程不乏一些有趣的问题,刚开始的想法是要改写Ext自带的Js,也就是点了前面那个+或者-号之后执行什么样的事件函数,为此还专门研究 了Ext的源代码也难怪之前自己手写树型的时候都是这样弄的,这可能就是所谓的思维定势吧!问题的解决主要是因为看了一篇文章之后（http://www.dojochina.com/index.php?q=node/937） 突然来了灵感，在此对该文的作者表示感谢；看了这篇文章之后还是有些担心,比如担心一个节点会被加载多次;把代码写好之后才发现这样的担心其实是多余的,这些细节Ext全都帮我们封装好了,最是太High了;现总结如下：

 

1 前台页面代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>checkbox.html</title>
   
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="../scripts/ext/resources/css/ext-all.css">
    <script type="text/javascript" src="../scripts/ext/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="../scripts/ext/ext-all.js"></script>
    <script type="text/javascript" src="../scripts/js/MultiComboBox.js"></script>

   
    <script type="text/javascript">
 
   
    Ext.onReady(function(){
            var root=new Ext.tree.AsyncTreeNode({
               id:'0',
               text:'root'
            });
           
            var data=new Ext.tree.TreeLoader({url:'tree.jsp'});
        
            var tree=new Ext.tree.TreePanel({
               renderTo:'test',
               root:root,
               loader:data,
               width:300
            });
            data.on('beforeload',function(treeLoader,node){
             
               this.baseParams.text=node.attributes.text;
            
            },data);
         });
      
        </script>

  </head>
 
  <body>
     <div id="test"></div>
  </body>
</html>

 

 

2  tree.jsp代码如下：

<%@ page language="java" import="java.util.*,test.Test1"
    pageEncoding="UTF-8"%>
<%@ page language="java" import="java.io.PrintWriter;"%>
<%
    System.out.println("到达了Tree.jsp");
    String text = request.getParameter("text");
    System.out.println("text---" + text);

    response.setContentType("text/x-json");

    PrintWriter outer = response.getWriter();
    if (text.equalsIgnoreCase("root")) {
        outer.print(Test1.rootChildren);

    }

    if (text.equalsIgnoreCase("1")) {
        outer.print(Test1.firstChildren);

    }

    if (text.equalsIgnoreCase("2")) {
        outer.print(Test1.secordChildren);

    }
    outer.flush();
    outer.close();
%>

 

有兴趣的朋友可以下载 地址拦中输入：http://localhost:8080/treeTest/test/tree.html 即可以看到效果

 

分享到：
| 在Eclipse中安装Ext插件
评论
2 楼 kyvin 2009-03-13  
学习下 look下下 不过代码尽量还是用 code
1 楼 leonelwong 2009-03-13  
不错，但是隐式对象out也是输出流，为什么要重新创建一个输出流呢，这样比较浪费资源啊，其实案例上的例子可以跑通，关键是JSP处理不能输出合法的格式导致的
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics