Ext_tree(动态tree)

最新推荐文章于 2024-06-21 15:04:08 发布

wang609128516

最新推荐文章于 2024-06-21 15:04:08 发布

阅读量96

点赞数

分类专栏： Ext 文章标签： EXT Servlet SQL Server 数据结构 DAO

Ext 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

以下是一个和数据库进行交互的一个动态树的一个示例:
以下是一个dttree.jsp:

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>动态Tree</title>

<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css">

<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>

<script type="text/javascript" src="ext/ext-all.js"></script>

<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">



<style type="text/css">

.b{

background-image: url(img/add16.gif)!important;

}

</style>

</head>

<script type="text/javascript">

Ext.onReady(function(){

var root=new Ext.tree.AsyncTreeNode({//生成Tree的根节点

text:"中国",

id:"0",//默认为0

draggable : false,

iconCls:"b"

});

//定义一个treePanel,用来显示tree的结构

var treePanel=new Ext.tree.TreePanel({

title:"动态Tree",

width:350,

height:300,

root:root,

renderTo:Ext.getBody(),

autoScroll:true,//显示滚动条

animate : true,//true表示使用动画展开/折叠

//enableDD : true,//允许拖放

containerScroll : true,//登记本容器ScrollManager

listeners:{//在加载之前的一个监听事件

'beforeload':function(node){

alert(node.id);//得到的节点

node.loader=new Ext.tree.TreeLoader({//树节点的数据来源

url:"treeServlet",//请求的路径

baseParams:{//请求参数

id:node.id

}

});

}

}

});

//treePanel.setRootNode(root);//追加节点

treePanel.on('click', function(tree, node){

alert("fsdf");

});

treePanel.render();//重新加载数据

});

</script>

<body><br><br></body>

</html>

以下是一个servlet:TreeServlet.java

package com.wm.sevlet;

import java.io.IOException;

import java.io.PrintWriter;

import java.sql.SQLException;

import java.util.List;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import com.wm.dao.CtiyDao;

import com.wm.pojo.City;

public class TreeServlet extends HttpServlet {

/**

* Constructor of the object.

*/

public TreeServlet() {

super();

}

/**

* Destruction of the servlet. <br>

*/

public void destroy() {

super.destroy(); // Just puts "destroy" string in log

// Put your code here

}

/**

* The doGet method of the servlet. <br>

*

* This method is called when a form has its tag value method equals to get.

*

* @param request the request send by the client to the server

* @param response the response send by the server to the client

* @throws ServletException if an error occurred

* @throws IOException if an error occurred

*/

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

this.doPost(request, response);

}

/**

* The doPost method of the servlet. <br>

*

* This method is called when a form has its tag value method equals to post.

*

* @param request the request send by the client to the server

* @param response the response send by the server to the client

* @throws ServletException if an error occurred

* @throws IOException if an error occurred

*/

public void doPost(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

response.setContentType("text/html");

PrintWriter out = response.getWriter();

StringBuffer sb=new StringBuffer();

String id=request.getParameter("id");

CtiyDao cd=new CtiyDao();

try {

List list=cd.findAllCity(Integer.parseInt(id));

sb.append("[");

for (int i = 0; i < list.size(); i++) {

City city=(City) list.get(i);

if(list.size()-1>i){

sb.append("{id:"+city.getTid()+",firstId:"+city.getFirstId()+",text:'"+city.getCityType()+"'},");

}else{

sb.append("{id:"+city.getTid()+",firstId:"+city.getFirstId()+",text:'"+city.getCityType()+"'}");

}

}

sb.append("]");

} catch (ClassNotFoundException e) {

// TODO Auto-generated catch block

e.printStackTrace();

} catch (SQLException e) {

// TODO Auto-generated catch block

e.printStackTrace();

}

/// System.out.println(sb.toString());

out.print(sb.toString());

}

/**

* Initialization of the servlet. <br>

*

* @throws ServletException if an error occure

*/

public void init() throws ServletException {

// Put your code here

}

}

数据格式:

[{id:1,firstId:0,text:'beijing'},

{id:2,firstId:0,text:'shanghai'},

{id:3,firstId:0,text:'shandong'},

{id:4,firstId:0,text:'tianjin'}]

=====运行效果如附件=====