JSP树形菜单根据数据库默认选择
JSP树形菜单的实现(转载)
(2009-04-20 15:21:03)
转载
标签：
杂谈 分类：技术讲解
1。原理简介
dtree是一个免费的javascript脚本，只需定义有限的几个参数，就可以做出漂亮的树型菜单。下载目录：https://www.360docs.net/doc/9014327004.html,/javascripts/tree/
以下是dtree的用法示例：
1）初始化菜单
2）调用函数
显然，如果用动态的脚本来初始化菜单数组（asp,jsp均可），那就可以很方便的实现动态的树型菜单了。
2。jsp动态实现
分以下步骤实现动态的树型菜单：
1）在数据库建tree_info表，有nodeId，parentNodeId，nodeName，nodeUrl四个字段，来存储节点信息。
2）编写java类，用于从数据库找出节点信息，并且生成javascript脚本。
3）编写tag类。用于封装逻辑，简化jsp的开发。
4）建一个web程序进行测试。
3。详细过程
1）在数据库建表，脚本如下：
CREATE TABLE `test`.`tree_info` (
`node_id` INTEGER UNSIGNED NOT NULL DEFAULT -1,
`parent_id` INTEGER UNSIGNED NOT NULL DEFAULT -1,
`node_name` VARCHAR(45) NOT NULL,
`ref_url` VARCHAR(45) NOT NULL,
PRIMARY KEY(`node_id`)
)
我使用mysql数据库，如果脚本细节有出入，请自行修改
按照上面的dTree示例插入数据
2）编写TreeInfo.java，这个类用于封装节点信息
package com.diegoyun.web.tree;
public class TreeInfo {
private int nodeId = -1;//node id
private int parentId = -1;//parentId
private String nodeName = null;//node name
private String url = null;//url references
public int getNodeId() {
return nodeId;
}
public void setNodeId(int nodeId) {
this.nodeId = nodeId;
}
public int getParentId() {
return parentId;
}
public void setParentId(int parentId) {
this.parentId = parentId;
}
public String getNodeName() {
return nodeName;
}
public void setNodeName(String nodeName) {
this.nodeName = nodeName;
}
public String getUrl() {
return url;
}
public void setUrl(String url) {
this.url = url;
}
}
编写TreeUtil.java，用于从数据库得到节点信息，封装到TreeInfo对象，并生成javascript
脚本
TreeUtil.java
package com.diegoyun.web.tree;
import java.util.Collection;
import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.Connection;
import java.sql.DriverManager;
public class TreeUtil {
public static List retrieveNodeInfos(){
List coll = new ArrayList();
String driverName = "com.mysql.jdbc.Driver";
String host = "localhost";
String port = ":3306";
String serverID = "test";
String userName = "root";
String userPwd = "root";
String url = "jdbc:mysql://" + host + port + "/" + serverID ;
Connection conn = null ;
PreparedStatement ps = null;
ResultSet rs = null;
try{
Class.forName(driverName).newInstance();
conn = DriverManager.getConnection(url , userName , userPwd);
String sql = "select * from tree_info";
ps = conn.prepareStatement(sql);
rs = ps.executeQuery();
TreeInfo info = null;
while(rs!=null && rs.next()){
info = new TreeInfo();
info.setNodeId(rs.getInt(1));
info.setParentId(rs.getInt(2));
info.setNodeName(rs.getString(3));
info.setUrl(rs.getString(4));
coll.add(info);
}
// if(rs!=null){
// rs.close();
// rs=null;
// }
// if(ps!=null){
// ps.close();
// ps=null;
// }
}catch(Exception e){
System.out.println(e);
}
return coll;
}
public static String createTreeInfo(List alist){
StringBuffer contents = new StringBuffer();
contents.append("");
return contents.toString();
}
public static void main(String[]args){
List alist = TreeUtil.retrieveNodeInfos();
// TreeInfo info = null;
// for(Iterator i = c.iterator();i.hasNext();){
// info = (TreeInfo)i.next();
// System.out.println("*****" + info.getNodeName());
// }
System.out.println(TreeUtil.createTreeInfo(alist));
}
}
3)编写标签类
InitTreeTag.java
package com.diegoyun.web.taglibs;
import com.diegoyun.web.tree.TreeUtil;
import javax.servlet.jsp.tagext
.TagSupport;
import javax.servlet.jsp.JspException;
import java.io.IOException;
public class InitTreeTag extends TagSupport{
public int doEndTag() throws JspException {
StringBuffer tree = new StringBuffer();
tree.append("\n");
try{
pageContext.getOut().println(tree.toString());
}catch(IOException ioe){
ioe.printStackTrace();
}
return super.doEndTag();
}
}
ShowTreeTag.java :
package com.diegoyun.web.taglibs;
import javax.servlet.jsp.tagext.TagSupport;
import javax.servlet.jsp.JspException;
import java.io.IOException;
public class ShowTreeTag extends TagSupport{
public int doEndTag() throws JspException {
StringBuffer buffer = showTree();
try {
pageContext.getOut().println(buffer.toString());
}
catch (IOException ioe) {
ioe.printStackTrace();
}
return super.doEndTag();
}
private StringBuffer showTree(){
StringBuffer sb = new StringBuffer();
sb.append("
sb.append("\n");
sb.append("
return sb;
}
}
标签的tld如下：
PUBLIC "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.2//EN"
"https://www.360docs.net/doc/9014327004.html,/dtd/web-jsptaglibrary_1_2.dtd">
4）建立web过程，编写jsp进行测试。
index.jsp如下：
<%@ page language="java"%>
<%@ taglib uri="/WEB-INF/tlds/tree.tld" prefix="tree"%>
Tree example :
测试，enjoy yourself！
5）修改过的JS文件
function TreeSelector(item, data, rootId) {
this._data = data;//下拉列表菜单的数组
this._item = item;//下拉列表菜单对像
this._rootId = rootId;//创建菜单的根结点
this._sel=0;
}
//创建菜单不带默认选项
TreeSelector.prototype.createTree = function() {
var len = this._data.length;
var temp = 0;
for
( var i = 0; i < len; i++) {
//if (this._data[i].pid=='9'){temp = i;}
if (this._data[i].pid == this._rootId) {
this._item.options.add(new Option(".." + this._data[i].text,
this._data[i].id));
for ( var j = 0; j < len; j++) {
this.createSubOption(len, this._data[i], this._data[j]);
}
}
}
};
TreeSelector.prototype.createSubOption = function(len, current, next) {
var blank = "..";
if (next.pid == current.id) {
intLevel = 0;
var intlvl = this.getLevel(this._data, this._rootId, current);
for (a = 0; a < intlvl; a++)
blank += "..";
blank += "├-";
this._item.options.add(new Option(blank + next.text, next.id));
for ( var j = 0; j < len; j++) {
this.createSubOption(len, next, this._data[j]);
}
}
};
TreeSelector.prototype.getLevel = function(datasources, topId, currentitem) {
var pid = currentitem.pid;
if (pid != topId) {
for ( var i = 0; i < datasources.length; i++) {
if (datasources[i].id == pid) {
intLevel++;
this.getLevel(datasources, topId, datasources[i]);
}
}
}
return intLevel;
};
//根据需要选择菜单值创建对应下拉菜单选择
function SelTreeSelector(item, data, rootId,did) {
this._data = data;//下拉列表菜单的数组
this._item = item;//下拉列表菜单对像
this._rootId = rootId;//创建菜单的根结点
this._sel=0;
this._did=did;//缺省的选择菜单值
}
//创建下拉菜单带默认选项主要用于修改状态
SelTreeSelector.prototype.createTree = function() {
var len = this._data.length;
var temp = 0;
for ( var i = 0; i < len; i++) {
if (this._data[i].pid == this._rootId) {
this._item.options.add(new Option(".." + this._data[i].text,
this._data[i].id));
for ( var j = 0; j < len; j++) {
this.createSubOption(len, this._data[i], this._data[j]);
}
}
}
for ( var i=0;i
}
this._item.options.selectedIndex=this._sel;
};
SelTreeSelector.prototype.createSubOption = function(len, current, next) {
var blank = "..";
if (next.pid == current.id) {
intLevel = 0;
var intlvl = this.getLevel(this._data, this._rootId, current);
for (a = 0; a < intlvl; a++)
blank += "..";
blank += "├-";
this._item.options.add(new Option(blank + next.text, next.id));
for ( var j = 0; j < len; j++) {
this.createSubOption(len, next, this._data[j]);
}
}
};
SelTreeSelector.prototype.getLevel = function(datasources, topId, currentitem) {
var pid = currentitem.pid;
if (pid != topId) {
for ( var i = 0; i < datasources.length; i++) {
if (datasources[i].id == pid) {
intLevel++;
this.getLevel(datasources, topId, datasources[i]);
}
}
}
return intLevel;
};