速動(dòng)畫(huà)教程第十四集
使用struts-menu制作樹(shù)型菜單實(shí)例
下載:http://sonic.peakle.net/download/sonic014.rar
制作人:速
新建j2ee工程,工程名稱(chēng)為:struts-menu
Context root URL: /menu
選中Add JSTL libraries to WEB-INF/lib forlder? JSTL版本(隨意)
以下所有的文件可以從源代碼中拷貝
拷貝文件中的以下內(nèi)容到工程的webroot目錄中
images、scripts、styles、templates 四個(gè)文件夾
拷貝以下文件到 /WEB-INF/ 目錄
struts-menu.tld
struts-menu-el.tld
menu-config.xml
拷貝以下文件到 /WEB-INF/lib/ 目錄
struts-menu-2.3.jar
velocity-1.4.jar
velocity-tools-view-1.0.jar
拷貝以下文件到 /src/ 目錄
globalMacros.vm
拷貝以下文件到 /WEB-INF/lib/ 目錄,此文件是在使用j2ee1.4版本創(chuàng)建工程時(shí)才需要
commons-lang-2.0.jar ,此文件將在錄像包中提供
刷新工程
創(chuàng)建Struts框架
按下Ctrl + N ,使用向?qū)略?struts 插件
Plugin class: net.sf.navigator.menu.MenuPlugIn
點(diǎn)擊 add 按鈕,在對(duì)話框中填入以下內(nèi)容
Property:menuConfig
Value:/WEB-INF/menu-config.xml
按下Ctrl + N ,使用向?qū)略?Action
Use case:find
其它使用默認(rèn)值
在WebRoot目錄中新建兩個(gè)jsp文件,index.jsp 、 ok.jsp
創(chuàng)建一個(gè) Forward
name:okGo
Path:/ok.jsp
修改 index.jsp 文件,內(nèi)容如下:
<html>
<head>
<title>ok</title>
</head>
<body>
<a href="find.do">Find</a>
</body>
</html>
修改 ok.jsp 文件,內(nèi)容如下:
<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ taglib uri="/WEB-INF/struts-menu.tld" prefix="menu" %>
<%@ taglib uri="/WEB-INF/struts-menu-el.tld" prefix="menu-el" %>
<%@ taglib uri="/WEB-INF/c.tld" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Dynamic, Database-driven Menu</title>
<link rel="stylesheet" type="text/css" media="all"
href="<c:url value="/styles/menuExpandable.css"/>" />
<script type="text/javascript"
src="<c:url value="/scripts/menuExpandable.js"/>"></script>
<link rel="stylesheet" type="text/css" media="all"
href="<c:url value="/styles/xtree.css"/>" />
<script type="text/javascript"
src="<c:url value="/scripts/xtree.js"/>"></script>
<link rel="stylesheet" type="text/css" media="all"
href="<c:url value="/styles/global.css"/>" />
<script type="text/javascript">
/* Function for showing and hiding elements that use ‘display:none‘ to hide */
function toggleDisplay(targetId) {
if (document.getElementById) {
target = document.getElementById(targetId);
if (target.style.display == "none"){
target.style.display = "";
} else {
target.style.display = "none";
}
}
}
</script>
</head>
<body>
<div class="dynamicMenu">
<menu:useMenuDisplayer name="ListMenu" repository="repository">
<menu:displayMenu name="DatabaseMenu"/>
<menu:displayMenu name="StandaloneMenu"/>
</menu:useMenuDisplayer>
</div>
<