`
as1001001
  • 浏览: 90987 次
  • 性别: Icon_minigender_1
  • 来自: 鞍山
社区版块
存档分类
最新评论

利用DTree来制作js树

阅读更多
整体思路就是利用java方法取出树节点对象的数组,将其传给js端,利用DTree来生成树。
DTree网址:http://destroydrop.com/javascripts/tree/


//节点对象类
public class BookMo {
	
	private int bookId;
	private String bookName;
	private int bookTId;

	BookMo(int id, String name, int bookTId) {
		this.bookId = id;
		this.bookName = name;
		this.bookTId = bookTId;
	}

	public int getBookId() {
		return bookId;
	}

	public void setBookId(int bookId) {
		this.bookId = bookId;
	}

	public String getBookName() {
		return bookName;
	}

	public void setBookName(String bookName) {
		this.bookName = bookName;
	}

	public float getBookTId() {
		return bookTId;
	}

	public void setBookPrice(int bookTId) {
		this.bookTId = bookTId;
	}

}


//给节点赋值和位置ID,生成对应的js代码
import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;

public class BookDb {
	
	private static List<BookMo> treeList;
	
	static {
		treeList = new ArrayList<BookMo>();
//第三个参数是父节点ID
		BookMo bm = new BookMo(1, "book", -1);
		treeList.add(bm);
		bm = new BookMo(2, "computer book", 1);
		treeList.add(bm);
		bm = new BookMo(3, "other book", 1);
		treeList.add(bm);
		bm = new BookMo(4, "thinking in java", 2);
		treeList.add(bm);
		bm = new BookMo(5, "core java", 2);
		treeList.add(bm);
		bm = new BookMo(6, "effective java", 2);
		treeList.add(bm);
		bm = new BookMo(7, "GOF", 2);
		treeList.add(bm);
		bm = new BookMo(8, "明朝那些事儿", 3);
		treeList.add(bm);
		bm = new BookMo(9, "疯狂的程序员", 3);
		treeList.add(bm);
		bm = new BookMo(10, "圈子圈套", 3);
		treeList.add(bm);
	}
	
	public List<BookMo> getBookNodes() {
		return treeList;
	}
	
	// 返回定义且生成页面树的 js 字符串   
	public String getJSTreeString(){   
	    Iterator<BookMo> treeIt = getBookNodes().iterator();   
	    StringBuffer sbf = new StringBuffer();   
	    // 定义js树对象   
	    sbf.append("dtree = new dTree(\"dtree\");");   
	    while(treeIt.hasNext()){   
	    	BookMo nd = treeIt.next();   
	        // 增加 js树结点,可以指定点击的调用方法   
	        sbf.append("dtree.add("+nd.getBookId()+","+nd.getBookTId()+",\""+nd.getBookName()+"\",\"javascript: void(0);\");");   
	    }   
	    // 输出js树   
	    sbf.append("document.write(dtree);");   
	       
	    return sbf.toString();   
	}
}


jsp页面
<%@ page language="java" contentType="text/html; charset=UTF-8"  
    pageEncoding="UTF-8"%>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<%@page import="com.LY.dtree.BookDb"%><html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>Show Tree</title>  
<link rel="StyleSheet" type="text/css" href="dtree.css" />  
<script type="text/javascript" src="dtree.js"></script>  
</head>  
<body>  
<script type="text/javascript">  
eval('<%=new BookDb().getJSTreeString()%>');   
</script>  
  
</body>  
</html> 


具体的二次开发可参考http://programmerdigest.cn/2009/12/607.html

补充:一般我们在用Js树时都会需要checkbox,这时需要添加部分代码(见附件),至于取出选中的节点数组,可以在点击checkbox动作后进行一次遍历,选出被选的节点标识,组成一个字符串,把它赋给同页面中的隐藏文本框,这样就能取出来了。
分享到:
评论

相关推荐

    dtree

    例如,如果使用React,可以将dtree作为一个自定义组件开发,利用React的state和props机制来管理树的状态和数据交互。 总之,dtree是构建树形用户界面的有效工具,它的制作涉及数据结构、渲染、事件处理等多个方面。...

    Dtree树形结构连接数据库的具体实现代码

    本文将详细介绍如何在JSP环境中利用Dtree组件实现与数据库的交互,动态生成树形结构。 #### 二、技术准备 为了实现本文所述的功能,需要完成以下准备工作: 1. **安装SQL Server 2000 JDBC驱动**:确保服务器环境...

    javascript 树形菜单

    在本文中,我们将深入探讨如何利用JavaScript来创建一个动态的、可交互的树形菜单。 首先,我们需要了解树形菜单的基本概念。在计算机科学中,树是一种数据结构,它由节点(或称为顶点)和边组成,每个节点可以有零...

    ASP+ACCESS搜索引擎模块源代码和数据库文件

    在这个"ASP+ACCESS搜索引擎模块源代码和数据库文件"的实例中,我们可以深入学习如何利用ASP技术和ACCESS数据库来构建一个简单的搜索引擎。 1. ASP基础:ASP的核心是脚本语言,如VBScript或JScript,它们在服务器上...

    js-jsp制作做类似 资管理器的菜单

    "js-jsp制作做类似资源管理器的菜单"这个主题聚焦于如何利用JavaScript(js)和JavaServer Pages(jsp)技术来实现这样的功能。以下是对这些知识点的详细解释: 首先,JavaScript是一种广泛使用的客户端脚本语言,...

    JAVA上百实例源码以及开源项目源代码

    Java波浪文字制作方法及源代码 1个目标文件 摘要:Java源码,初学实例,波浪文字 Java波浪文字,一个利用Java处理字符的实例,可以设置运动方向参数,显示文本的字符数组,高速文本颜色,显示字体的 FontMetrics对象,...

    java源码包---java 源码 大量 实例

    1个目标文件,JNDI的使用例子,有源代码,可以下载参考,JNDI的使用,初始化Context,它是连接JNDI树的起始点,查找你要的对象,打印找到的对象,关闭Context…… ftp文件传输 2个目标文件,FTP的目标是:(1)提高...

    java源码包2

    1个目标文件,JNDI的使用例子,有源代码,可以下载参考,JNDI的使用,初始化Context,它是连接JNDI树的起始点,查找你要的对象,打印找到的对象,关闭Context…… ftp文件传输 2个目标文件,FTP的目标是:(1)提高...

    java源码包3

    1个目标文件,JNDI的使用例子,有源代码,可以下载参考,JNDI的使用,初始化Context,它是连接JNDI树的起始点,查找你要的对象,打印找到的对象,关闭Context…… ftp文件传输 2个目标文件,FTP的目标是:(1)提高...

    java源码包4

    1个目标文件,JNDI的使用例子,有源代码,可以下载参考,JNDI的使用,初始化Context,它是连接JNDI树的起始点,查找你要的对象,打印找到的对象,关闭Context…… ftp文件传输 2个目标文件,FTP的目标是:(1)提高...

    成百上千个Java 源码DEMO 4(1-4是独立压缩包)

    Java波浪文字制作方法及源代码 1个目标文件 摘要:Java源码,初学实例,波浪文字 Java波浪文字,一个利用Java处理字符的实例,可以设置运动方向参数,显示文本的字符数组,高速文本颜色,显示字体的 FontMetrics对象,...

    成百上千个Java 源码DEMO 3(1-4是独立压缩包)

    Java波浪文字制作方法及源代码 1个目标文件 摘要:Java源码,初学实例,波浪文字 Java波浪文字,一个利用Java处理字符的实例,可以设置运动方向参数,显示文本的字符数组,高速文本颜色,显示字体的 FontMetrics对象,...

Global site tag (gtag.js) - Google Analytics