jsp中mztreeview的应用实例

lion222

浏览: 125060 次
来自: ...

最近访客更多访客>>

yanxing_xinlan

chenjianweijw

zh9100_cn

hanli204016

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (94)

社区版块

存档分类

JSP JavaScript CSS SQL ASP

web中tree的应用非常广泛,动态tree的实现也是多种多样,这里主要是写下我用mztreeview(梅花雪大侠所写)的jsp例子.

梅大侠的文档中给了个asp的例子,但是在jsp中如何应用呢?熟知asp和jsp的人可以很好的把程序移植,但是对于不是同时很熟悉这2中语言的人来说,有一个jsp例子,会方便很多.

1.首先,下载控件,MzTreeView10

2.(最好)将控件放到工程目录下

3,建立数据库

create table tree
(
id int primary key,
parentId int,
text varchar(50),
hint varchar(100),
icon varchar(20),
data varchar(20),
url varchar(50),
target varchar(20),
method varchar(50)
)

然后往数据库中插入数据,

注意:mztreeview默认一个须根节点,其父节点值是0

4,做数据服务层

这个是关键,树的动态生成一半要靠它(另一半借助javascript代码),这个类的主要方法是要生成要生成树的数据所需的数据,其中Contants.treeName是个常量,这个要与界面上定义的mztreeview对象的名称一致

import java.sql.ResultSet;
import java.sql.SQLException;

import com.xaccp.qingyun.db.DBManager;
import com.xaccp.qingyun.entity.Contants;
import com.xaccp.qingyun.exception.MyException;
import com.xaccp.qingyun.factory.DBFactory;
import java.util.*;
public class TreeService {
DBManager dm=null;

public String getTree() throws MyException
{

//DBFactory是我写的一个工厂类,DBManager是个底层数据库操纵类
//用到的几个方法根据方法名也能理解,就不多说了
dm=DBFactory.createDBManager();

  String sql="select * from shelf";
  try {
   dm.createPreparedStatement(sql);
   ResultSet rs=dm.executeQueryPrepareStatement();
   String tree="";
   while(rs.next())
   {
    String id=String.valueOf(rs.getInt("id"));
    String pid=String.valueOf(rs.getInt("parentId"));
    String text=rs.getString("text");
    String hint=rs.getString("hint");
    String url=rs.getString("url");
    String target=rs.getString("target");
    tree +="\n"+Contants.treeName+".nodes[\""+pid+"_"+id+"\"]=\"";

//这里我只做了几个判断,其他的自己做判断就行
    if(text !=null && text.trim()!="")
    {
     tree +="text:"+text+";";
    }
    if(hint!=null && hint.trim().equals(""))
    {
     tree +="hint:"+hint+";";
    }
    if(url!=null && url.trim().equals(""))
    {
     tree +="url:"+url+";";
    }
    if(target!=null && target.trim().equals(""))
    {
     tree +="target:"+target+";";
    }
    tree +="\"";
   }

   return tree;
  } catch (Exception e) {
   throw new MyException("can't create tree"); //MyException是我定义的异常类
  }
  finally
  {
   dm.closeDB();
  }
}

5,做界面层

这时候有几点要非常注意,1,编码一定要用GBK(这个我尝试了好久,只有GBK才能正常显示)

2.树的名字要跟Contants.treeName常量的值一样

<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<jsp:directive.page import="com.xaccp.qingyun.bean.TreeService"/>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
    <title>梅花雪中文网 - 网页脚本控件集 MzTreeView10</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <meta name="author" content="黄方荣(meizz·梅花雪)://www.meizz.com">
    <script language="JavaScript" src="MzTreeView10/MzTreeView10.js"></script>
    
    <style>
    A.MzTreeview
    {
      font-size: 9pt;
      padding-left: 3px;
    }
    </style>
</head>

<body bgcolor="#FFFFDB" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    window.tree = new MzTreeView("tree");

    tree.icons["property"] = "property.gif";
    tree.icons["css"] = "collection.gif";
    tree.icons["book"] = "book.gif";
    tree.iconsExpand["book"] = "bookopen.gif"; //展开时对应的图片
    tree.setIconPath("MzTreeView10/"); //可用相对路径
<%
  TreeService ts=new TreeService();
  String tree=ts.getTree();
  out.print(tree);
%>

    tree.setURL("#");
    tree.setTarget("MzMain");
    document.write(tree.toString());    //亦可用 obj.innerHTML = tree.toString();
    //-->
    </SCRIPT>
</body>
</html>