easy_UI
引入js/css样式
<link rel="stylesheet" type="text/css" href="<%=path%>/easyUI/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="<%=path%>/easyUI/themes/icon.css">
<link rel="stylesheet" type="text/css" href="<%=path%>/easyUI/css/demo.css">
<script src="<%=path%>/js/jquery-1.8.3.js"></script>
<!--jquery.easyui.min.js包含了easyUI中的所有插件-->
<script src="<%=path%>/js/jquery.easyui.min.js"></script>
编写script
<script>
$(function(){
$('#tree').tree({
url:'basic_tree_data.json', //远程加载tree数据的url路径
animate:true, //是否开启动画效果
checkbox:true, //是否显示复选框
cascadeCheck:false, //是否开启级联选中，checkbox属性为true时才生效
onlyLeafCheck:true, //是否只在叶节点前显示复选框，checkbox属性为true时才生效
dnd:true, //是否启用拖拽功能
onDblClick:function(node){ //鼠标双击事件
$(this).tree("toggle",node.target); //改变当前节点状态
}
});
});
</script>
编写body
<body>
<h2>easy UI Tree</h2>
<ul id="tree"></ul>
</body>
编写basic_tree_data.json
[{
"id":1,
"text":"功能菜单",
"children":[{
"id":11,
"text":"投票管理",
"children":[{
"id":111,
"text":"所有投票",
"attributes":{
"url":"findAll"
},
"iconCls":"icon-search"
},{
"id":112,
"text":"发起投票",
"iconCls":"icon-add"
}]
},
{
"id":12,
"text":"用户管理",
"state":"open",
"children":[{
"id":121,
"text":"个人信息"
},{
"id":122,
"text":"参与投票记录",
"iconCls":"icon-search"
},{
"id":123,
"text":"发起投票记录",
"iconCls":"icon-search"
}]
},{
"id":13,
"text":"系统管理",
"state":"open",
"children":[{
"id":131,
"text":"系统日志"
},{
"id":132,
"text":"数据字典"
}]
}]
}]
实现效果
easy_UI的更多相关文章
- easy_UI datagrid view数据格式化
从数据库中提取的信息,有时候需要后期处理一下,easy_ui给了我们很好的一个方法,根据easy_ui生成datagridview的两种方式,下面用两种方式来格式化显示数据信息 1,通过脚本生成的da ...
- 操作Easy_UI案例以及模板
操作easy_ui案例以及模板 https://pan.baidu.com/s/1dHfclwP 密码:jygk
- easy_UI 投票列表
首先我们考虑一下在项目投票种用到的属性(ID,投票标题,备选项目,参与人数) entity package cn.entity; public class GridNode { private Lon ...
- jquery动态添加/删除 tr/td
<head runat="server"> <title></title> <!--easyui --> <link rel= ...
- 使用EasyUI设计.net项目的菜单数实例
最近领导说我们之前的项目采用的菜单树模型过时了,现在采用EasyUI来设计了,于是学习了第三方资源库easyUI,发觉果然是好东西,这里给大家分享下. 首先到官网下载源文件,这个是开源的,都可以下再, ...
- 键盘控制div上下左右移动 (转)
<html> <head> <title></title> <link rel="stylesheet" type=" ...
随机推荐
- Notes:SVG(2)---各种常见图形
1.矩形rect,指定rx,ry可以得到圆角矩形 <rect x="10" y="10" rx="10" ry="10&qu ...
- yum和apt-get有什么区别
一般来说著名的linux系统基本上分两大类: 1.RedHat系列:Redhat.Centos.Fedora等 2.Debian系列:Debian.Ubuntu等 RedHat 系列 1 常见的安装包 ...
- 基于trie树的具有联想功能的文本编辑器
之前的软件设计与开发实践课程中,自己构思的大作业题目.做的具有核心功能,但是还欠缺边边角角的小功能和持久化数据结构,先放出来,有机会一点点改.github:https://github.com/chu ...
- mysql+mycat搭建稳定高可用集群，负载均衡，主备复制，读写分离
数据库性能优化普遍采用集群方式,oracle集群软硬件投入昂贵,今天花了一天时间搭建基于mysql的集群环境. 主要思路 简单说,实现mysql主备复制-->利用mycat实现负载均衡. 比较了 ...
- IBatisNet -- 保护你的配置文件及映射文件信息
通常情况下我们在使用IBatisNet的时候,配置文件和映射文件都是暴露在外的,如果能进入到服务器,那么你的程序的操作数据库的SQL语句,数据库连接字符串等信息都将很轻松的被看到,这样是很危险的.然而 ...
- OData Client Code Generator
转发. [Tutorial & Sample] How to use OData Client Code Generator to generate client-side proxy cla ...
- 分布式搜索elasticsearch配置文件详解
elasticsearch的config文件夹里面有两个配置文件:elasticsearch.yml和logging.yml,第一个是es的基本配置文件,第二个是日志配置文件,es也是使用log4j来 ...
- El表达式的关系运算符
El表达式的关系运算符: == 对应 eq != 对应 ne > 对应 gt < 对应 It
- web.xml中url-pattern的用法
目录结构: // contents structure [-] url-pattern的三种写法 servlet匹配原则 filter匹配原则 语法错误的后果 参考文章 一.url-pattern的三 ...
- css和@import区别用法
css和@import都是调用外部样式表的方法. 一.用法 (1)link: <link rel="stylesheet" type="text/css" ...