`
wanchong998
  • 浏览: 236018 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

extjs tree异步加载 完整版

    博客分类:
  • J2EE
阅读更多
//创建JSONTree.java
package com.tree;

import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;

import net.sf.json.JSONArray;

import com.luke.hm.sf.ConnectionPool;

public class JSONTree{
    private String PID;
   
    public String getJSONString(){
   
        Connection conn =null;
        Statement st = null;
        ResultSet rs = null;
        ArrayList TreeNodeArray = null;
       
        String SQLString = "SELECT * FROM S_MLS WHERE PID="+this.PID+" ORDER BY DID";   
           
        try
        {
       
            conn = ConnectionPool.getConnection();
            st = conn.createStatement();
               
            rs = st.executeQuery("SELECT PID FROM S_MLS WHERE PID>0 Group By PID Order By PID");           
           
            StringBuffer parentIDBuffer =new StringBuffer();
            parentIDBuffer.append("|");        
            while(rs.next())
            {
                parentIDBuffer.append(rs.getString("PID"));
                parentIDBuffer.append("|");
            }
            //得到所有的parentDID列表(这是一个巧妙的算法^_^)
            String parentIDString = parentIDBuffer.toString();        
//            System.out.println(parentIDString);
            rs = st.executeQuery(SQLString);   
            TreeNodeArray = new ArrayList();
           
            while(rs.next())
            {
                JSONTreeNode TreeNode = new JSONTreeNode();
                TreeNode.setId(rs.getString("DID"));
                TreeNode.setText(rs.getString("JDMC"));
                TreeNode.setDescription(rs.getString("JDMC"));         
                TreeNode.setHref("rightframe.jsp?did="+rs.getString("DID").toString());
                TreeNode.setHrefTarget("rightFrame");
//                System.out.println(rs.getString("DID"));
//                System.out.println(parentIDString.indexOf("|"+rs.getString("DID")+"|"));
                if (parentIDString.indexOf("|"+rs.getString("DID")+"|")>=0) //父节点
                    {
                        TreeNode.setCls("folder");
                        TreeNode.setLeaf(false);
                        TreeNode.setExpandable(false);
                    }
                    else //子节点
                   {
                        TreeNode.setCls("file");
                        TreeNode.setLeaf(true);
                        TreeNode.setExpandable(false);
                    }
                    TreeNodeArray.add(TreeNode);
            }
           
//            System.out.println(TreeNodeArray.size());
//            System.out.println(JSONArray.fromObject(TreeNodeArray));
           
          
            JSONArray jsonarr = JSONArray.fromObject(TreeNodeArray); //得到JSON数组    
            return jsonarr.toString();//返回JSON数据
        }
        catch(Exception e)
        {
            System.out.println("getJSONString() of JSONTree.java throws : "+e.toString());
            return "";
        }finally{
        try {
conn.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
        }
       
       
       
    }  


    public String getPID() {
        return PID;
    }

    public void setPID(String pid) {
        PID = pid;
    }
    public static void main(String[] args) {
//    JSONTree tree = new JSONTree();
//    tree.setPID("1");
//    String tt = tree.getJSONString();
//    System.out.println(tt);
    }
}

//创建JSONTreeNode
package com.tree;

import java.io.Serializable;

public class JSONTreeNode implements Serializable{

    private static final long serialVersionUID = 1L;

    public static void main(String[] args) {
   
    }
   
     private String id;            //ID
     private String text;          //节点显示
     private String cls;           //图标
     private boolean leaf;         //是否叶子
     private String href;          //链接
     private String hrefTarget;    //链接指向
     private boolean expandable;   //是否展开
     private String description;   //描述信息

public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
public String getCls() {
return cls;
}
public void setCls(String cls) {
this.cls = cls;
}
public boolean isLeaf() {
return leaf;
}
public void setLeaf(boolean leaf) {
this.leaf = leaf;
}
public String getHref() {
return href;
}
public void setHref(String href) {
this.href = href;
}
public String getHrefTarget() {
return hrefTarget;
}
public void setHrefTarget(String hrefTarget) {
this.hrefTarget = hrefTarget;
}
public boolean isExpandable() {
return expandable;
}
public void setExpandable(boolean expandable) {
this.expandable = expandable;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
public static long getSerialVersionUID() {
return serialVersionUID;
}
    
         //get、set方法。略。

}
//创建index.jsp
<%@page contentType="text/html; charset=GBK"%>
<%@page import="com.luke.hm.tree.EJBContext"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
   
    <title>My JSP 'index.jsp' starting page</title>
   
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">   
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" type="text/css" href="<%=EJBContext.getRootPath()%>/ext/resources/css/ext-all.css"/>
<script type="text/javascript" src="<%=EJBContext.getRootPath()%>/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="<%=EJBContext.getRootPath()%>/ext/ext-all.js"></script>
<script type="text/javascript" src="./mytree.js"></script>
  </head>
 
  <body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" onContextMenu="return false;">
<tr>
   <td align="left" valign="top" >
      <!--树的填充区域-->
      <div id="tree_div" style="height:101%;width:100%"></div>
   </td>
</tr>
</table>

  </body>
</html>
//创建Tree.jsp
<%@ page language="java" pageEncoding="GBK"%>

<jsp:useBean class="com.tree.JSONTree" id="JSONTree"></jsp:useBean>

<%
String PID = "";

if (request.getParameter("DID")!=null)
{
    PID = request.getParameter("DID").toString();
}

JSONTree.setPID(PID);
// System.out.println(JSONTree.getJSONString());
%>

<%=JSONTree.getJSONString()%>
//创建mytree.js
Ext.onReady(function(){

   var Tree = Ext.tree;

   //定义根节点的Loader
   var treeloader=new Tree.TreeLoader({dataUrl:'tree.jsp?DID=1'});

   //异步加载根节点
   var rootnode=new Tree.AsyncTreeNode({
        id:'1',
        text:'目录树根节点'
                });
    
   var treepanel = new Tree.TreePanel({
                //renderTo:"tree_div",//如果使用renderTo,则不能使用setRootNode()方法,需要在TreePanel中设置root属性。
                el:'tree_div',        //填充区域
                rootVisible:true,     //隐藏根节点
                border:true,          //边框
                animate:true,         //动画效果
                autoScroll:true,      //自动滚动
                enableDD:false,       //拖拽节点             
                containerScroll:true,
                loader:treeloader            
            });

   //设置根节点
   treepanel.setRootNode(rootnode);

   //响应事件,传递node参数
   treepanel.on('beforeload',
                function(node){
                   treepanel.loader.dataUrl='tree.jsp?DID='+node.id;    //定义子节点的Loader   
                });

   treepanel.render();           
   rootnode.expand(false,false);
});


别忘记把json.jar加进去
库表设计
DID    PID     JDMC




分享到:
评论
5 楼 java麦克斯泰 2011-09-21  
getJSONString()

这个方法都没调用 不是完整 例子我 晕 为啥 都不开源呢
4 楼 liuwei8728 2010-04-28  
实在看不出算法巧妙在哪 
先补在拆     完全没必要
3 楼 helloandy2009 2010-01-06  
import net.sf.json.JSONArray;  这个类是干啥用的
2 楼 hanjiangit 2009-11-21  
貌似不行   啊
1 楼 leafxf 2009-01-04  
很好,有收获

相关推荐

    extjs 写的动态加载、增删改查、拖拽Tree(完整版)

    动态加载通常通过配置`rootVisible: false`、`loadMask: true`以及设置`treeStore`的`proxy`和`autoload`属性来实现,同时配合使用`treeStore.load()`方法来异步加载数据。 接下来是增删改查(CRUD)操作。在ExtJS ...

    extjs3.3 中文文档

    3. **组件库**:EXTJS 3.3包含了大量的预定义组件,如Grid面板、Tree面板、表单组件等。中文文档会详细介绍这些组件的使用方法、配置选项以及事件处理。 4. **数据管理**:EXTJS的数据模型(Model)、数据存储...

    深入浅出extjs(第二版)随书源码

    深入浅出ExtJS(第二版)是一本关于ExtJS的详细教程,旨在帮助读者掌握这一强大的前端开发工具。 该随书源码包含三个不同版本的ExtJS源码:ext-3.0.0、ext-3.1.1和ext-3.2.0。这涵盖了ExtJS 3.x的主要迭代,每个...

    中文的Extjs的api手册

    6. **树形视图(Tree)**:TreePanel组件可以用来展示层次结构的数据,支持拖放操作和动态加载。 7. **Ajax通信**:ExtJS内置了Ajax请求处理,可以方便地与服务器进行异步通信,实现数据的获取和提交。 8. **工具...

    Extjs3.0中文文档大全

    "51CTO下载-Extjs中文文档.pdf"可能是完整的中文版ExtJS 3.0官方文档,而"Ext3_API.rar"可能包含的是该版本的API离线版,方便开发者在无网络环境下查阅。 通过深入学习和理解这些文档,开发者可以充分利用ExtJS 3.0...

    extjs信息系统extjs信息系统

    1. **EXTJS组件使用**:理解EXTJS的各种组件,如Panel、Grid、Form、Tree等,以及如何根据需求组合和定制这些组件。 2. **数据绑定**:EXTJS支持双向数据绑定,通过Store与Model实现视图和数据的同步更新,简化了...

    Extjs4.0视频教程和源代码,另附文档翻译

    - **Tree高级组件**:讲解了Tree组件的特性和使用技巧,包括异步加载、拖拽操作等功能。 - **Form高级组件**:介绍了Form组件的特点,如字段布局、验证规则设置等。 - **Panel和Layout**:深入探讨Panel组件以及...

    ExtJS-3.4.0系列目录

    **ExtJS-3.4.0系列目录** 在ExtJS框架中,3.4.0版本提供了丰富的组件和功能,...在实际开发中,开发者还可以结合Ajax、Store、Proxy等概念来处理异步数据,以及利用ExtJS的事件系统进行组件间的通信和响应用户的操作。

    EXTJS开发总结.pdf

    与 Prototype 和 jQuery 等轻量级库不同,ExtJS 提供了一个完整的组件模型和丰富的用户界面控件,更适合构建功能丰富的 web 应用程序。在与 Prototype 和 jQuery 相比时,ExtJS 更接近于像 Isomorphic SmartClient ...

    ExtJS实用开发指南.pdf

    - **性能优化**:探讨如何减少DOM操作、利用异步加载等手段提高应用性能。 - **国际化支持**:介绍如何实现多语言支持,使应用能够适应不同地区的用户。 - **安全性考虑**:讨论防止XSS攻击、数据验证等安全措施。 ...

    Extjs开发总结(转).pdf

    它不绑定特定的服务端技术,而是通过各种方式与服务端通信,如使用`Ext.Ajax.request`进行普通异步请求,`Ext.tree.TreeLoader`加载树形数据,`Ext.data.Store`加载表格数据,以及`Ext.Element.update`进行局部页面...

    ExtJS官方中文教程_98page

    ExtJS 提供了一个完整的框架,包括了布局管理、数据绑定、事件处理、Ajax通信等功能。它的组件模型允许开发者快速构建复杂的用户界面,而无需深入HTML和CSS的细节。此外,ExtJS支持多种浏览器,确保了良好的跨平台...

    catalyst_extjs.ppt

    通过Ajax技术,前端的ExtJS组件可以与后端的Catalyst控制器进行通信,实现异步数据交换,更新页面无需刷新整个页面。例如,数据网格组件可以与Catalyst中的模型交互,动态加载、排序和编辑数据。 【示例应用】 一...

    extjs--ext-3.2.1

    3. **AJAX支持**:内置的AJAX支持使得与服务器端进行异步通信变得简单,通过XMLHttpRequest对象实现数据的无刷新加载和提交。 4. **表单组件**:ExtJS提供了强大的表单组件,包括文本框、下拉框、复选框、单选按钮...

    Extjs规范(自己的)

    通常,需要包含`ext-all.js`或`ext-debug.js`以获取完整的功能,但在生产环境中,应使用`ext-all.css`和`ext-all-no-debug.js`以优化性能。 二、必要性 遵循开发规范有助于提高代码的可读性、可维护性和团队协作...

    老师整理的extjs学习笔记

    它支持异步加载子节点,以及节点的拖放等功能。 **9.2 构建一棵静态的树** 构建一棵静态的树通常需要预先定义好树的数据结构,然后通过 `Ext.tree.TreePanel` 的配置选项来展示。 **9.3 构建动态的树** 构建动态...

    extjs-tree-editor-example:树面板项目和表单面板输入之间的迭代示例

    "extjs-tree-editor-example-master"很可能表示这是项目的主分支或源代码仓库,通常包含项目的完整代码、配置文件和其他资源。在这个目录下,我们可能会找到如HTML文件(用于构建页面结构),CSS文件(用于样式设计...

    Ext22中文API(完整版)

    Ext2.2中文API(完整版)是一款专为开发者设计的文档资料,它详细介绍了ExtJS 2.2版本的JavaScript库,这是一个广泛用于构建富客户端Web应用的框架。此API文档提供了完整的中文翻译,方便中国开发者理解和使用ExtJS...

    ext_动态树型的实现

    首先,需要创建一个`TreeLoader`对象,该对象用于处理异步加载数据的过程。这里我们假设服务器端提供了一个名为`TreeServlet.do`的接口,用来返回树形数据: ```javascript var treeLoader = new Ext.tree....

    Packtpub.Ext.JS.3.0.Cookbook.Oct.2009

    3. **数据绑定**:阐述如何使用Store和Model进行数据管理,以及如何与服务器进行异步通信,实现数据的加载、保存和更新。 4. **布局管理**:解释不同类型的布局(Layouts),如Fit、Border、Column等,以及如何根据...

Global site tag (gtag.js) - Google Analytics