• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >jquery > 基于EasyUI的基础之上实现树形功能菜单

基于EasyUI的基础之上实现树形功能菜单

作者:顾江波 字体:[增加 减小] 来源:互联网

顾江波 通过本文主要向大家介绍了easyui树形功能菜单,easyui,树形菜单等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

页面展示截图如下:

为了实现以上效果,在开始前必须先将环境配置一下。

第一步: 首先,先将 jquery-easyui-1.2.6 文件引入到工程项目下,并在jsp页面上进入引入3个jsp文件和2个css文件。如下:

<span style="font-size:14px;"> </span><span style="font-size:14px; white-space: pre;"> </span><span style="font-family:Courier New;font-size:12px;"><script type="text/javascript" src="jquery-easyui-1.2.6/jquery-1.7.2.min.js"></script>  
 <link rel="stylesheet" type="text/css" href="jquery-easyui-1.2.6/themes/default/easyui.css"> 
 <link rel="stylesheet" type="text/css" href="jquery-easyui-1.2.6/themes/icon.css"> 
 <script type="text/javascript" src="jquery-easyui-1.2.6/jquery.easyui.min.js"></script> 
 <script type="text/javascript" src="jquery-easyui-1.2.6/locale/easyui-lang-zh_CN.js"></script></span> 

引入顺序必须按照以上顺序引入,否则页面展示效果将出错。

第二步:引入jar包,分别为:commons-beanutils-1.8.3.jar、commons-collections-3.2.1.jar、commons-lang-2.5.jar、commons-logging-1.1.1.jar、ezmorph-1.0.6.jar、json-lib-2.3-jdk15.jar、mysql-connector-java-5.1.17-bin.jar

代码实现

1、创建数据表

<span style="font-size:14px;">drop database easyui; 
create database easyui; 
use easyui; 
show tables; 
#创建菜单表 
create table menu( 
 id int(11) not null auto_increment, ####菜单id### 
 name varchar(20) default null,  ####菜单名#### 
 url varchar(100) default null,  #### 菜单url#### 
 checked varchar(10) default null, ####菜单是否被选中 
 icon varchar(30) default null,  ####菜单图标#### 
 parent_id int(11) default null,  ####父节点菜单的id#### 
 primary key(id)       ####id是主键####    
); 
#插入测试数据   ####测试数据#### 
insert into menu(id,name,url,checked,icon,parent_id) values 
(1,'权限菜单',null,'',null,0), 
(2,'用户管理',null,'0',null,1), 
(3,'岗位管理',null,'',null,1), 
(4,'资源管理',null,'',null,1), 
(5,'用户功能1',null,'',null,2), 
(6,'岗位功能1',null,'0',null,3), 
(7,'资源功能2','/easyui/index.jsp','0',null,3), 
(8,'资源功能1','sss','0',null,4), 
(9,'岗位功能2',null,'',null,3), 
(10,'资源功能3','111','0',null,4), 
(11,'资源管理4','222','',null,4), 
(14,'岗位功能3','dfds',null,null,3), 
(17,'用户功能2','sss','0',null,2); 
#查看数据 
select * from menu; 
//查询跟节点 
select * from menu where parent_id=0; 
#查看指定父节点下有哪些子节点 
select * from menu where parent_id=2;</span><span style="font-size:24px;"> 
</span> 

2、JDBC连接工具类

JDBCUtils.Java

<span style="font-family:Courier New;font-size:12px;">package com.hsj.utils; 
import java.sql.Connection; 
import java.sql.DriverManager; 
import java.sql.PreparedStatement; 
import java.sql.ResultSet; 
import java.sql.SQLException; 
public class JDBCUtils { 
 static { 
  try { 
   Class.forName("com.mysql.jdbc.Driver"); 
  } catch (ClassNotFoundException e) { 
   e.printStackTrace(); 
  } 
 } 
 public static Connection getConnection() throws Exception { 
  return DriverManager.getConnection( 
    "jdbc:mysql:///easyui?useUnicode=true&characterEncoding=UTF-8", 
    "root", "zxczxc"); 
 } 
 public static void close(ResultSet rs, PreparedStatement ps, Connection conn) { 
  try { 
   if (rs != null) 
    rs.close(); 
  } catch (Exception e) { 
   e.printStackTrace(); 
  } finally { 
   try { 
    if (ps != null) 
     ps.close(); 
   } catch (Exception e) { 
    e.printStackTrace(); 
   } finally { 
    try { 
     if (conn != null) 
      conn.close(); 
    } catch (Exception e) { 
     e.printStackTrace(); 
    } 
   } 
  } 
 } 
}</span><span style="font-size:24px;"> 
</span> 

3、创建实体类domain

Menu.java

<span style="font-family:Courier New;font-size:12px;">package com.hsj.domain; 
public class Menu { 
 private int id; //菜单id 
 private String name; //菜单名 
 private String url; //菜单链接的网址 
 private String checked; //菜单是否被选中 
 private String icon; //菜单图标 
 private int parent_id; //当前菜单的父节点id 
 public Menu(){} 
 public Menu(int id, String name, String url, String checked, String icon,int parentId) { 
  this.id = id; 
  this.name = name; 
  this.url = url; 
  this.checked = checked; 
  this.icon = icon; 
  parent_id = parentId; 
 } 
 public int getId() { 
  return id; 
 } 
 public void setId(int id) { 
  this.id = id; 
 } 
 public String getName() { 
  return name; 
 } 
 public void setName(String name) { 
  this.name = name; 
 } 
 public String getUrl() { 
  return url; 
 } 
 public void setUrl(String url) { 
  this.url = url; 
 } 
 public String getChecked() { 
  return checked; 
 } 
 public void setChecked(String checked) { 
  this.checked = checked; 
 } 
 public String getIcon() { 
  return icon; 
 } 
 public void setIcon(String icon) { 
  this.icon = icon; 
 } 
 public int getParent_id() { 
  return parent_id; 
 } 
 public void setParent_id(int parentId) { 
  parent_id = parentId; 
 } 
} 
</span> 

TreeDTD.java

<span style="font-family:Courier New;font-size:12px;">package com.hsj.domain; 
import java.util.HashMap; 
import java.util.Map; 
public class TreeDTO { 
 private int id; 
 private String text; 
 private String iconCls; 
 private String checked; 
 private int parent_id; 
 private String state; 
 /** 
  * 自定义属性信息 
  */ 
 private Map<String, Object> attributes = new HashMap<String, Object>(); 
 public TreeDTO() { 
 } 
 public TreeDTO(int id, String text, String iconCls, String checked, 
   int parent_id, String state, Map<String, Object> attributes) { 
  this.id = id; 
  this.text = text; 
  this.iconCls = iconCls; 
  this.checked = checked; 
  this.parent_id = parent_id; 
  this.state = state; 
  this.attributes = attributes; 
 } 
 public int getId() { 
  return id; 
 } 
 public void setId(int id) { 
  this.id = id; 
 } 
 public String getText() { 
  return text; 
 } 
 public void setText(String text) { 
  this.text = text; 
 } 
 public String getIconCls() { 
  return iconCls; 
 } 
 public void setIconCls(String iconCls) { 
  this.iconCls = iconCls; 
 } 
 public String getChecked() { 
  return checked; 
 } 
 public void setChecked(String checked) { 
  this.checked = checked; 
 } 
 public int getParent_id() { 
  return parent_id; 
 } 
 public void setParent_id(int parentId) { 
  parent_id = parentId; 
 } 
 public String getState() { 
  return state; 
 } 
 public void setState(String state) { 
  this.state = state; 
 } 
 pu



 
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 基于EasyUI的基础之上实现树形功能菜单

相关文章

  • JQuery操作iframe父页面与子页面的元素与方法(实例讲解)
  • jQuery简单实现QQ空间点赞已经取消点赞
  • jQuery中常用动画效果函数(日常整理)
  • jQuery阻止移动端遮罩层后页面滚动
  • 给jQuery方法添加回调函数一款插件的应用
  • jQuery点击tr实现checkbox选中的方法
  • 详解jQuery UI库中文本输入自动补全功能的用法
  • jQuery获取radio选中项的值实例
  • jquery中选择块并改变属性值的方法
  • 基于jQuery实现图片的前进与后退功能

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • jquery实现树形菜单完整代码
    • jQuery easyui datagrid动态查询数据实例讲解
    • jQuery插件select2利用ajax高效查询大数据列表(可搜索、可分页)
    • JQuery的常用选择器、过滤器、方法全面介绍
    • jQuery代码实现实时获取时间
    • jQuery动画animate方法使用介绍
    • LazyForm jQuery plugin 定制您的CheckBox Radio和Select
    • jQuery给动态添加的元素绑定事件的方法
    • jquery+easeing实现仿flash的载入动画
    • 让人印象深刻的10个jQuery手风琴效果应用

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有