jsp頁面:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <script type="text/javascript" src="tree/js/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="tree/js/jquery.ztree.core.js"></script> <script type="text/javascript" src="tree/js/jquery.ztree.excheck.js"></script> <script type="text/javascript" src="tree/js/jquery.ztree.exedit.js"></script> <link rel="stylesheet" href="tree/css/zTreeStyle/zTreeStyle.css" type="text/css"> </head> <body> <div> <ul id="treeDemo" class="ztree"></ul> </div> </body> </html> <script type="text/javascript"> /** * 頁面初始化 */ $(document).ready(function(){ onLoadZTree(); }); var zTree; var setting = { view: { dblClickExpand: false,//雙擊節點時，是否自動展開父節點的標識 showLine: true,//是否顯示節點之間的連線 fontCss:{'color':'black','font-weight':'bold'},//字體樣式函數 selectedMulti: false //設置是否允許同時選中多個節點 }, check:{ //chkboxType: { "Y": "ps", "N": "ps" }, chkStyle: "checkbox",//復選框類型 enable: false //每個節點上是否顯示 CheckBox }, data: { simpleData: { enable:true, idKey: "organid", pIdKey: "parentid", rootPId: 0 }, key:{ name : "dzzmc", title : "dzzmc" } }, callback: { beforeClick: function(treeId, treeNode) { zTree = $.fn.zTree.getZTreeObj("treeDemo"); if (treeNode.isParent) { zTree.expandNode(treeNode);//如果是父節點，則展開該節點 }else{ zTree.checkNode(treeNode, !treeNode.checked, true, true);//單擊勾選，再次單擊取消勾選 } }, onClick : zTreeOnClick } }; /* var zNodes =[ { id:1, pId:0, name:"test 1", open:false}, { id:11, pId:1, name:"test 1-1", open:true}, { id:111, pId:11, name:"test 1-1-1"}, { id:112, pId:11, name:"test 1-1-2"}, { id:12, pId:1, name:"test 1-2", open:true}, ]; $(document).ready(function(){ $.fn.zTree.init($("#treeDemo"), setting, zNodes); }); */ function zTreeOnClick(t,treeId,treeNode){ //節點的id,name alert(treeNode.organid + "," + treeNode.dzzmc); } function onCheck(e,treeId,treeNode){ var treeObj=$.fn.zTree.getZTreeObj("treeDemo"), nodes=treeObj.getCheckedNodes(true), v=""; for(var i=0;i<nodes.length;i++){ v+=nodes[i].name + ","; alert(nodes[i].id); //獲取選中節點的值 } } //動態獲取 /** * 加載樹形結構數據 */ function onLoadZTree(){ var treeNodes; $.ajax({ async:false,//是否異步 cache:false,//是否使用緩存 type:'post',//請求方式：post dataType:'json',//數據傳輸格式：json url:'getTreeDemo.action',//請求的action路徑 error:function(){ //請求失敗處理函數 alert('請求失敗！'); }, success:function(data){ //請求成功后處理函數 treeNodes = data;//把后台封裝好的簡單Json格式賦給treeNodes } }); var t = $("#treeDemo"); t = $.fn.zTree.init(t, setting, treeNodes); } </script>
后台action代碼
package cn.csservice.cssdj.dy.action.dychange; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import org.springframework.beans.factory.annotation.Autowired; import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.JSONArray; import com.opensymphony.xwork.Action; import cn.csservice.cssdj.common.utils.Ajax; import cn.csservice.cssdj.common.utils.Constants; import cn.csservice.cssdj.common.utils.Messages; import cn.csservice.cssdj.common.utils.StringHelper; import cn.csservice.cssdj.core.DictionaryConstant; import cn.csservice.cssdj.core.action.UserAction; import cn.csservice.cssdj.entity.DictItemDTO; import cn.csservice.cssdj.entity.TreeNode; import cn.csservice.cssdj.entity.dy.DZZInfo; import cn.csservice.cssdj.service.UtilServiceOrgan; import cn.csservice.cssdj.service.cache.DictCacheService; import cn.cssservice.cssdj.service.dychange.DyChangeInfoSimpleService; /** * @author * @date 下午4:49:19 */ public class DirDzzInfo extends UserAction { private static final long serialVersionUID = 1L; private Integer type; @Autowired private DyChangeInfoSimpleService dyChangeInfoSimpleService; public DirDzzInfo() { } @Override protected String userGo() { List<DZZInfo> list = dyChangeInfoSimpleService.dirDzz(); result = JSON.toJSONString(list); /*result = Ajax.JSONResult(0, Messages.getString("systemMsg.success"), dyChangeInfoSimpleService.toJsonArrayDzz(list));*/ return Action.SUCCESS; } }
詳細文檔鏈接和插件下載地址 : http://www.treejs.cn/v3/api.php
具體后台sql詳解地址(oracle) : http://www.cnblogs.com/colder/p/4838574.html