ztree+ajax 用法

来源：互联网发布：认识制作优化石真语编辑：程序博客网时间：2024/04/27 11:23

<span style="font-family: Arial, Helvetica, sans-serif;"><a target=_blank href="http://www.zuidaima.com/share/1550463523818496.htm"><strong><span style="font-size:18px;">原文</span></strong></a></span>

<span style="font-family: Arial, Helvetica, sans-serif;">index.jsp</span>

<%@ page language="java" 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%>"><title>树</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><link rel="stylesheet" href="<%=basePath%>plugins/ztree/css/zTreeStyle.css" type="text/css" /><script type="text/javascript" src="<%=basePath%>js/jquery.js"></script><script type="text/javascript" src="<%=basePath%>plugins/ztree/jquery.ztree.all-3.0.min.js"></script><script type="text/javascript">var setting = {//设置setting 对象data: {simpleData: {enable: true,//设置是否使用简单数据模式(Array)idKey: "treeId",//设置节点唯一标识属性名称pIdKey: "parentId"//设置父节点唯一标识属性名称},key: {name: "name",//zTree 节点数据保存节点名称的属性名称title: "name"//zTree 节点数据保存节点提示信息的属性名称}},async: {enable: true,//开启异步加载//如果设置为 true，请务必设置 setting.async 内的其它参数。//如果需要根节点也异步加载，初始化时 treeNodes 参数设置为 null 即可url:"data.jsp",//设置异步获取节点的 URL 地址autoParam:["treeId"]//设置父节点数据需要自动提交的参数},callback: {//回调函数onClick: function(event, treeId, treeNode){//点击事件的触发函数alert(treeNode.name);//提示点击节点的名字}}};//初始化树function initTree() {$.ajax({  //JQuery的Ajax   type: 'POST',     dataType : "json",//返回数据类型   async:false,   url: "data.jsp",//请求的action路径   data: {"flag":true},  //同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行   error: function () {//请求失败处理函数         alert('请求失败');     },   success:function(data){ //请求成功后处理函数。  取到Json对象data       treeNodes = data;   //把后台封装好的简单Json格式赋给treeNodes           $.fn.zTree.init($("#treeDiv"), setting, treeNodes);//初始化树，传入树的Dom<pre name="code" class="html">

} }); }$(document).ready(function(){//在加载网页内容之前执行initTree();});</script></head><body><div id="treeDiv" class="ztree"></div></body></html>

data.jsp

<%@ page language="java" import="com.demo.action.*" pageEncoding="UTF-8"%><%String json = "";//回传的json数据if(null != request.getParameter("flag")){//初始化树json = TreeAction.create();System.out.println("初始:" + json);}else{//异步加载树String treeId = request.getParameter("treeId");json = TreeAction.fetchAsyTreeData(treeId);//引用Action中函数获取相应节点ID的Json信息System.out.println("异步:" + json);}out.println(json);//传回response对象json%>

3.TreeAction.java

package com.demo.action;import java.util.ArrayList;import java.util.List;import net.sf.json.JSONArray;import com.demo.bean.TreeBean;/** *  * @author tanfei * @date Mar 4, 2013 9:49:19 AM */public class TreeAction {/** * 创建树及其初始化数据 * @return */public static String create(){//模拟初始化数据List<TreeBean> list = new ArrayList<TreeBean>();/********以下数据在正式应用中应该从数据库获取，此刻为了显示而模拟数据************/TreeBean tree = new TreeBean();tree.setTreeId("1");tree.setName("中国");tree.setIsParent(true);list.add(tree);JSONArray json = JSONArray.fromObject(list);//将List转换为Json类型return json.toString();//返回Json}/** *  * @param parentId 父结点 * @return 子节点json数据 */public static String fetchAsyTreeData(String parentId){List<TreeBean> list = new ArrayList<TreeBean>();/********以下数据在正式应用中应该从数据库获取，此刻为了显示而模拟了几条数据************/switch(Integer.valueOf(parentId)){case 1:{TreeBean tree = new TreeBean();tree.setTreeId("1001");tree.setName("重庆直辖市");tree.setParentId("1");tree.setIsParent(true);TreeBean tree2 = new TreeBean();tree2.setTreeId("1002");tree2.setName("江苏省");tree2.setParentId("1");tree2.setIsParent(true);list.add(tree);list.add(tree2);break;}case 1001:{TreeBean tree = new TreeBean();tree.setTreeId("1001001");tree.setName("江北区");tree.setParentId("1001");tree.setIsParent(false);TreeBean tree2 = new TreeBean();tree2.setTreeId("1001002");tree2.setName("渝中区");tree2.setParentId("1001");tree2.setIsParent(false);TreeBean tree3 = new TreeBean();tree3.setTreeId("1001003");tree3.setName("渝北区");tree3.setParentId("1001");tree3.setIsParent(false);TreeBean tree4 = new TreeBean();tree4.setTreeId("1001004");tree4.setName("沙坪坝区");tree4.setParentId("1001");tree4.setIsParent(false);list.add(tree);list.add(tree2);list.add(tree3);list.add(tree4);break;}case 1002:{TreeBean tree = new TreeBean();tree.setTreeId("1002001");tree.setName("南京市");tree.setParentId("1002");tree.setIsParent(false);list.add(tree);break;}}JSONArray json = JSONArray.fromObject(list);return json.toString();}/** * 主函数 * @param args */public static void main(String[] args) {System.out.println(TreeAction.create());System.out.println(TreeAction.fetchAsyTreeData("1"));}}

4.treeBeen.java

package com.demo.bean;import java.io.Serializable;/** *  * @author tanfei  * @date Mar 4, 2013 9:43:56 AM */public class TreeBean implements Serializable{<span style="white-space:pre"></span>/**<span style="white-space:pre"></span> *序列号 <span style="white-space:pre"></span> */<span style="white-space:pre"></span>private static final long serialVersionUID = 4542667966180441411L;<span style="white-space:pre"></span><span style="white-space:pre"></span>/********************树的基本属性***********************/<span style="white-space:pre"></span>//节点id<span style="white-space:pre"></span>private String treeId;<span style="white-space:pre"></span>//父节点id<span style="white-space:pre"></span>private String parentId;<span style="white-space:pre"></span>//名称<span style="white-space:pre"></span>private String name;<span style="white-space:pre"></span><span style="white-space:pre"></span>//是否是父节点<span style="white-space:pre"></span>private Boolean isParent;<span style="white-space:pre"></span><span style="white-space:pre"></span>//----------------------GETTER AND SETTER-----------------------------------<span style="white-space:pre"></span>public String getTreeId() {<span style="white-space:pre"></span>return treeId;<span style="white-space:pre"></span>}<span style="white-space:pre"></span>public void setTreeId(String treeId) {<span style="white-space:pre"></span>this.treeId = treeId;<span style="white-space:pre"></span>}<span style="white-space:pre"></span>public String getParentId() {<span style="white-space:pre"></span>return parentId;<span style="white-space:pre"></span>}<span style="white-space:pre"></span>public void setParentId(String parentId) {<span style="white-space:pre"></span>this.parentId = parentId;<span style="white-space:pre"></span>}<span style="white-space:pre"></span>public String getName() {<span style="white-space:pre"></span>return name;<span style="white-space:pre"></span>}<span style="white-space:pre"></span>public void setName(String name) {<span style="white-space:pre"></span>this.name = name;<span style="white-space:pre"></span>}<span style="white-space:pre"></span>public Boolean getIsParent() {<span style="white-space:pre"></span>return isParent;<span style="white-space:pre"></span>}<span style="white-space:pre"></span>public void setIsParent(Boolean isParent) {<span style="white-space:pre"></span>this.isParent = isParent;<span style="white-space:pre"></span>}<span style="white-space:pre"></span><span style="white-space:pre"></span>}

commons-beanutils-1.7.0.jar
commons-collections-3.2.jar
commons-lang-2.3.jar
commons-logging-1.1.1.jar
ezmorph-1.0.6.jar
json-lib-2.1.jar
json-lib-2.2.3-jdk15.jar

0 0