easyui的树型列表
来源:互联网 发布:经纬度计算距离软件 编辑:程序博客网 时间:2024/06/06 20:05
1、定义表格
<div id="search">
<a href="javascript:void(0);" onclick="addModule()" class="easyui-linkbutton" iconCls="icon-add" plain="true">添加</a>
<a href="javascript:void(0);" class="easyui-linkbutton" iconCls="icon-edit" plain="true">修改</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true">删除</a>
<div style="float:right;">
<input id="condition" class="easyui-searchbox" data-options="prompt:'搜索'" style="width:230px;vertical-align:middle;" />
<a href="#" class="easyui-linkbutton" plain="true">高级检索</a>
</div>
</div>
<table id="list_data" cellspacing="0" cellpadding="0">
</table>
2、初始化js
$('#list_data').treegrid({
url : '${ctx}/menu/getListJson.json?condition='+ condition, //服务器地址,返回json格式数据
title : '菜单列表',
width : 700,
idField:'id',
method:'POST',
treeField:'text',
pagesize : 1, //默认10
nowrap : true,
autoRowHeight : true,
striped : true,
collapsible : false,
loadMsg : '数据加载中......',
fitColumns : true,//允许表格自动缩放,以适应父容器
singleSelect : false,//是否单选
pagination : true,//分页控件
frozenColumns : [ [ {
field : 'ck',
checkbox : true
}, ] ],
onBeforeExpand:function(row){
if(row){
$('#list_data').treegrid('options').url = "${ctx}/menu/getMenuJson?id=" + row.id;
}
},
columns : [ [
{ field : 'text', width : 150, title : '名称' },
{ field : 'uri', width : 150, title : '路径' },
{ field : 'permission', width : 150, title : '英文名称' },
{ field : 'isDisable', width : 150, title : '是否可用',formatter : function(value, row, index){
return row.isDisable == 1 ? '可用' : '不可用';
} }/* ,
{ field : 'opt', width : 150, title : '操作', align : 'center', formatter : function(value, rec, index) {
return '<span style="color:red"><a href="#" onclick="testSave(' + rec.id + ')">修改</a> <a href="javascript:void(0)">删除</a></span>';
}
} */ ] ],
pagination : true, //分页控件
toolbar : "#search"
});
- easyui的树型列表
- 使用easyui实现列表的批量删除
- easyui 与 spring MVC 的列表显示
- easyui 列表datagrid初始化两次的问题
- EasyUi的ComboBox(下拉列表框)
- easyui待复选框的下拉列表
- EasyUI中包选择按钮的下拉列表的使用方法
- easyUI 下拉列表
- select下拉列表(easyui)
- easyui下拉列表属性
- select下拉列表(easyui)
- datagrid easyui列表数据
- easyui 列表及分页
- easyui datagrid 点击列表头排序出现错乱的原因
- easyui-combobox 下拉列表的JSON获取数据例子
- easyui列表中的/Date(1352649600000)/时间显示的问题
- easyUI对列表的增、删、改、查例子。
- 使用easyUI框架实现列表的整体排序
- HTML IE版本过滤器
- bwlabel和bwconncomp区别
- 在Ubuntu 14.04 64bit上编译并研究State Threads网络线程库源码
- SSDB:高性能数据库服务器
- Spring mvc4使用JSON包变更
- easyui的树型列表
- Python3.4+Nginx+Django1.8+Mysql5.5项目开发与部署
- 异常处理的执行顺序
- javaweb原理及其相关知识
- 学习Objective-C之基础数据结构
- 通信网络实验-嗅探器实现
- Class类
- SVN使用笔记
- 版本控制(8)--使用git演示案例