<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%> //一些引入的标签在这个jsp里面
<script type="text/javascript">
$(function() { //页面加载的时候加载这个栏目树
$('#columntree').tree({
animate : true,
url : 'articleColumnController.do?showTree',
onClick : function(node) {
$(this).tree('toggle', node.target);
$("#columnpanel").panel("refresh",'articleInfoController.do?articleInfo&channelId='+node.id); //点击数的节点得到一个panel面板
}
});
});
</script>
<div class="easyui-layout" fit="true"> //页面布局
//CENTER开始
<div region="center" style="padding: 3px;" class="easyui-panel" id="columnpanel" fit="true"></div> //中间center是个树(页面加载就加载了)
//CENTER结束
//WEST开始
<div region="west" style="width: 150px;" title="新闻栏目" split="true"> //west是panel面板(通过点击数刷新一个面板)
<div class="easyui-panel" style="padding: 1px;" fit="true" border="false">
<ul id="columntree"></ul>
</div>
</div>
//WEST结束
</div>
//这个是west要显示面板内容
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<html>
<head>
</head>
<body>
<div id="lay" class="easyui-layout" style="width: 85%; height: 100%">
<div region="center" id="showinfo" style="display: block;">
<t:datagrid name="contentList" title="新闻内容"
actionUrl="articleInfoController.do?datagrid&channelid=${channelId}"
idField="id" fit="true">
<t:dgCol title="编号" field="id" hidden="false"></t:dgCol>
<t:dgCol title="文章标题" field="title"></t:dgCol>
<t:dgDelOpt title="删除" url="articleInfoController.do?del&id={id}" />
<t:dgToolBar title="录入" icon="icon-add"
url="articleInfoController.do?addorupdate&channelId=${channelId}"
funname="add"></t:dgToolBar>
<t:dgToolBar title="编辑" icon="icon-edit"
url="articleInfoController.do?addorupdate&channelId=${channelId}"
funname="update"></t:dgToolBar>
<t:dgToolBar title="查看" icon="icon-search"
url="articleInfoController.do?addorupdate" funname="detail"></t:dgToolBar>
</t:datagrid>
</div>
</div>
</body>
</html>
树的建立原理总结:
1,建立一个符合jquery_easyui的tree的vo
public class TreeVO {
private String id ;
private String text ;
private String iconCls ;
private int checked ;
private String parent_id ;
private Map<String, Object> attributes = new HashMap<String, Object>();
private String state ;
public String getId() {
return id;
}
public void setId(String 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 int getChecked() {
return checked;
}
public void setChecked(int checked) {
this.checked = checked;
}
public String getParent_id() {
return parent_id;
}
public void setParent_id(String parentId) {
parent_id = parentId;
}
public Map<String, Object> getAttributes() {
return attributes;
}
public void setAttributes(Map<String, Object> attributes) {
this.attributes = attributes;
}
public String getState() {
return state;
}
public void setState(String state) {
this.state = state;
}
public TreeVO(String id, String text, String iconCls, int checked,
String parentId, Map<String, Object> attributes, String state) {
super();
this.id = id;
this.text = text;
this.iconCls = iconCls;
this.checked = checked;
parent_id = parentId;
this.attributes = attributes;
this.state = state;
}
public TreeVO() {
super();
// TODO Auto-generated constructor stub
}
}
2.建立一个树的表原则,有个主键id,还有一个父节点的id,首先建立一个根节点id为1父节点pid为9999;
id:2,pid:1 这个就是在根节点的叶子节点,如果在建立一个id:3,pid:2,那么这个节点是叶子节点而id:2的就是这个节点的父节点,
id:1
----id:2
-----id:3
3.编写方法查找树
//每个都有父节点
public List<TreeVO> findTreeVOList(String nodeid) {
if(nodeid ==null){
nodeid="9999";
}
StringBuffer sql=new StringBuffer();
sql.append("select ID,name,pid from tb_article_column where pid="+"'"+nodeid +"'");
List list = getSession().createSQLQuery(sql.toString()).list();
Iterator iter = list.iterator();
//业务需求的栏目信息
List<ArticleColumn> articlecolumnList =new ArrayList<ArticleColumn>();
while(iter.hasNext()){
ArticleColumn column=new ArticleColumn();
Object[] obj = (Object[])iter.next();
String id=(String) obj[0];
String name=(String) obj[1];
String pid=(String) obj[2];
column.setId(id);
column.setName(name);
column.setPid(pid);
articlecolumnList.add(column);
}
//填充TreeVO得到一个集合
List<TreeVO> treeList =new ArrayList<TreeVO>();
for(ArticleColumn ac:articlecolumnList){
TreeVO tree=new TreeVO();
tree.setId(ac.getId());
tree.setParent_id(ac.getPid());
tree.setText(ac.getName());
if(getChildren(ac.getId()).size()>0){ //是否有子文件夹
tree.setState("closed");
}else{
tree.setState("open");
}
treeList.add(tree);
}
return treeList;
}
//通过pid查找是否是叶子
public List<ArticleColumn> getChildren(String pid){
if(pid ==null){
pid="9999";
}
StringBuffer sql=new StringBuffer();
sql.append("select ID,name,pid from tb_article_column where pid="+"'"+pid+"'");
List list = getSession().createSQLQuery(sql.toString()).list();
Iterator iter = list.iterator();
List<ArticleColumn> articlecolumnChildrenList =new ArrayList<ArticleColumn>();
while(iter.hasNext()){
ArticleColumn column=new ArticleColumn();
Object[] obj = (Object[])iter.next();
String id=(String) obj[0];
String name=(String) obj[1];
String pid1=(String) obj[2];
column.setId(id);
column.setName(name);
column.setPid(pid1);
articlecolumnChildrenList.add(column);
}
return articlecolumnChildrenList;
}
4.在录入的时候把父节点也给录入进去,获取当前节点的父节点,然后录入进去,知道跟节点