1. Principles
Dtree is a free Javascript script. You only need to define a limited number of parameters to create a beautiful tree menu. Download directory:Http://www.destroydrop.com/javascripts/tree/
The following is an example of dtree usage:
1) initialize the menu
<SCRIPT type = "text/JavaScript">
<! --
VaR tree = new array;
// Nodeid | parentnodeid | nodename | nodeurl
Tree [0] = "1 | 0 | page 1 | #";
Tree [1] = "2 | 1 | Page 1.1 | #";
Tree [2] = "3 | 1 | Page 1.2 | #";
Tree [3] = "4 | 3 | PAGE 1.2.1 | #";
Tree [4] = "5 | 1 | PAGE 1.3 | #";
Tree [5] = "6 | 2 | PAGE 1.1.1 | #";
Tree [6] = "7 | 6 | PAGE 1.1.1.1 | #";
Tree [7] = "8 | 6 | PAGE 1.1.1.2 | #";
Tree [8] = "9 | 1 | PAGE 1.4 | #";
Tree [9] = "10 | 9 | PAGE 1.4.1 | #";
Tree [10] = "11 | 0 | PAGE 2 | #";
// -->
</SCRIPT>
2) call a function
<Div class = "Tree">
<SCRIPT type = "text/JavaScript">
<! --
Createtree (tree, 1, 7); // starts the tree at the top and open it at node Nr. 7
// -->
</SCRIPT>
</Div>
Obviously, if you use dynamic scripts to initialize menu arrays (ASP and JSP), you can easily implement dynamic tree menus.
2. Dynamic JSP implementation
Follow these steps to implement a dynamic tree menu:
1) create a tree_info table in the database, which contains four fields: nodeid, parentnodeid, nodename, and nodeurl to store node information.
2) Write a Java class to find node information from the database and generate a Javascript script.
3) Compile the tag class. It is used to encapsulate logic and simplify JSP development.
4) create a web program for testing.
3. Detailed Process
1) create a table in the database. The script is as follows:
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 ')
)
I am using the MySQL database. If the script details are different, Please modify it by yourself
Insert data according to the preceding dtree example.
2) Compile treeinfo. java. This class is used to encapsulate node Information
Package com. diegoyun. Web. tree;
/**
* @ Author diegoyun
* @ Version 1.0
*/
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;
}
}
Compile treeutil. Java to obtain node information from the database, encapsulate it into the treeinfo object, and generate a Javascript script
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;
/**
* @ Author diegoyun
* @ Version 1.0
*/
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.exe cutequery ();
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 ("<! -- \ N ");
Contents. append ("Var tree = new array;"); // create a array in Javascript
Treeinfo info = NULL;
For (INT max = alist. Size (), I = 0; I <Max; I ++ ){
Info = (treeinfo) alist. Get (I );
// Define elements of Array
Contents. append ("tree [");
Contents. append (I );
Contents. append ("] = \"");
Contents. append (info. getnodeid ());
Contents. append ("| ");
Contents. append (info. getparentid ());
Contents. append ("| ");
Contents. append (info. getnodename ());
Contents. append ("| ");
Contents. append (info. geturl ());
Contents. append ("\";");
}
Contents. append ("docment. Writer (tree );");
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) Compile the label class
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;
/**
* @ Author diegoyun
* @ Version 1.0
*/
Public class inittreetag extends tagsupport {
Public int doendtag () throws jspexception {
Stringbuffer tree = new stringbuffer ();
Tree. append ("<SCRIPT type = \" text/JavaScript \ "> \ n ");
Tree. append (treeutil. createtreeinfo (treeutil. retrievenodeinfos ()));
Tree. append ("</SCRIPT> \ 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;
/**
* @ Author diegoyun
* @ Version 1.0
*/
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 ("<Div class = \" tree \ "> \ n ");
SB. append ("<SCRIPT type = \" text/JavaScript \ "> \ n ");
SB. append ("<! -- \ N ");
SB. append ("createtree (tree); \ n ");
SB. append ("// --> \ n ");
SB. append ("</SCRIPT> \ n ");
SB. append ("</div> \ n ");
Return Sb;
}
}
The tag TLD is as follows:
<? XML version = "1.0" encoding = "ISO-8859-1"?>
<! Doctype taglib
Public "-// Sun Microsystems, Inc. // dtd jsp tag library 1.2 // en"
"Http://java.sun.com/dtd/web-jsptaglibrary_1_2.dtd">
<Taglib>
<Tlib-version> 1.0 </tlib-version>
<JSP-version> 1.2 </JSP-version>
<Short-Name> tree </short-Name>
<! -- Inittreetag -->
<Tag>
<Name> init </Name>
<Tag-class> com. diegoyun. Web. taglibs. inittreetag </Tag-class>
<Body-content> Empty </body-content>
</Tag>
<! -- Showtreetag -->
<Tag>
<Name> show </Name>
<Tag-class> com. diegoyun. Web. taglibs. showtreetag </Tag-class>
<Body-content> Empty </body-content>
</Tag>
</Taglib>
4) create a web process and compile JSP for testing.
Index. jsp is as follows:
<% @ Page Language = "Java" %>
<% @ Taglib uri = "/WEB-INF/TLDs/tree. TLD" prefix = "Tree" %>
<HTML>
<Head>
<Title> tree example </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = iso-8859-1">
<LINK rel = "stylesheet" href = "tree.css" type = "text/CSS">
<SCRIPT type = "text/JavaScript" src = "tree. js"> </SCRIPT>
<Tree: init/>
</Head>
<Body>
<B> tree example: </B> <br/>
<Tree: Show/>
<Br/>
</Body>
</Html>
Test, enjoy yourself!
4. Problem to be resolved
Dtree has a small bug. If the path of CSS, IMG, and JS is changed, the tree may not be correctly displayed.