jt项目菜单页面实现

jt项目菜单页面实现

一. 业务描述:

1) 数据呈现时使用bootstrap中的treeGrid插件(基于jquery实现).

　　bootstrap特点:简洁、直观、强悍、移动设备优先的前端开发框架，让web开发更迅速、简单。

2) 页面加载完成,异步加载数据,以树结构table形式呈现.

 

二. 业务实现:

1) 引入treeGrid相关js文件　

　　<script type="text/javascript" src="bower_components/treegrid/jquery.treegrid.extension.js"></script>　　<script type="text/javascript" src="bower_components/treegrid/jquery.treegrid.min.js"></script>　　<script type="text/javascript" src="bower_components/treegrid/tree.table.js"></script>

 

2) 定义方法异步加载数据

 

 

三. 代码实现:

 

function doGetObjects(){
　　//1构建treeTable对象
　　var table=new TreeTable(
　　　　"menuTable",
　　　　"menu/doFindObjects.do",
　　　　columns)
　　//2初始化treeTable对象
　　//table.setExpandAll(true);
　　table.setExpandColumn(2);//设置从那一列展开内容(默认为第一列)
　　table.init();//底层会发起ajax请求
}

 

获取选中的记录:

 

　　function doGetCheckedId(){
　　　　//1.获取选中的记录
　　　　var selections=$("#menuTable")
　　　　//bootstrapTreeTable是treeGrid插件内部定义的jquery扩展函数
　　　　//getSelections为扩展函数内部要调用的一个方法
　　　　.bootstrapTreeTable("getSelections");
　　　　//2.对记录进行判定
　　　　if(selections.length==1)
　　　　return selections[0].id;
　　}