`

JQuery zTree v2.6 基本用法实例

阅读更多
JQuery zTree v2.6
基本用法实例

初始化zTree:
		var zTree1;
		var setting;
		var zNodes =[];
	function refreshTree(asyncUrl) {
		$("#getUrl").html("");
		$("#onAsyncSuccessNode").html("<br/>");
		$("#onAsyncErrorNode").html("<br/>");

	
		setting = {
			checkable: true,
			async: true,
			//asyncUrl: "/Gw_sptrainTree_search.do?id=50",  //获取节点数据的URL地址
			asyncUrl: getAsyncUrl,  //获取节点数据的URL地址
			asyncParam: ["name", "id", "group", "trainunit"],  //获取节点数据时,必须的数据名称,例如:id、name
			asyncParamOther: ["sptrainID","50"], //其它参数 ( key, value 键值对格式)
			callback:{
				beforeAsync: zTreeBeforeAsync,
				asyncSuccess: zTreeOnAsyncSuccess,
				asyncError: zTreeOnAsyncError
			}
		};

获取动态Url的方法:
	function getAsyncUrl(treeNode){
		var specialtyNum = document.getElementById("id").value;
		var positionNum = document.getElementById("positionNum").value;
		var url = "";
		if(treeNode==null){
			url = "/Gw_sptrainTree_search.do?id=50&specialtyNum="+specialtyNum+"&positionNum="+positionNum+"";
		}else{
			url = "/Gw_sptrainTree_search.do?id="+treeNode.id+"&specialtyNum="+specialtyNum+"&positionNum="+positionNum+"";
		}
	    return url;
		
	}




		zTree1 = $("#treeDemo").zTree(setting, zNodes);
	}

Action:
package com.company.erp.train.gw_sptrain.action;

import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.Collection;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Map;
import java.util.Set;
import java.util.TreeMap;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;

import com.company.erp.common.gw_sptrain.databean.Gw_sptrainDO;
import com.company.erp.common.gw_trainunit.databean.Gw_trainunitDO;
import com.company.erp.common.gw_tugroup.databean.Gw_tugroupDO;
import com.company.util.Common;
import com.gsf.arch.BaseAction;
import com.gsf.tool.exception.BaseException;

public class Gw_sptrainTree_searchAction  extends BaseAction{

	@Override
	public ActionForward execute(ActionMapping mapping, ActionForm form,
			HttpServletRequest request, HttpServletResponse response)
			throws Exception {
		String id = request.getParameter("id");

		if (id != null && !id.equals("")) {
			response.setCharacterEncoding("gb2312");
			response.setContentType("text/xml charset=gb2312");
			PrintWriter out = response.getWriter();
			searchTopTugroup(request, id, out);
			out.flush();
			return null;
		} else {
			return (mapping.findForward("success"));
		}
	}

	public void searchTopTugroup(HttpServletRequest request, String id,
			PrintWriter out) throws BaseException {
		Long parent_id = Long.parseLong(id);
		// 构造数据begin
		TreeMap<Long, Long> all_map = null;
		TreeMap<Long, Long> select_map = null;
		// 专业、岗位
		//获取页面hidden的专业工种
		String specialtyCode = request.getParameter("specialtyNum");
		String positionCode = request.getParameter("positionNum");

		if(specialtyCode==null || positionCode==null || specialtyCode.equals("") ||positionCode.equals("")){
			
		}else{
			// 根据培训单元
			String cacheName = "Gw_sptrain";
			String className = Gw_sptrainDO.class.getName();
			ArrayList gw_sptrain_list = Common.parseDBCache(cacheName, className);
	
			// 进行排序 以trainunit_id排列 培训单元显示的先后顺序 treemap排序
			TreeMap<Long, Gw_sptrainDO> gw_sptrain_Select_map = new TreeMap<Long, Gw_sptrainDO>();
			for (int i = 0; i < gw_sptrain_list.size(); i++) {
				Gw_sptrainDO gw_sptrainDO = (Gw_sptrainDO) gw_sptrain_list.get(i);
				if (gw_sptrainDO.getSpecialtyNum().equals(Long.valueOf(specialtyCode))
						&& gw_sptrainDO.getPositionNum().equals(Long.valueOf(positionCode))) {
					gw_sptrain_Select_map
							.put(gw_sptrainDO.getTrainunit_id(), gw_sptrainDO);
				}
			}
	
			// 将map的数据add到list
			ArrayList<Gw_sptrainDO> gw_sptrain_Select_list_filter = new ArrayList<Gw_sptrainDO>();
			gw_sptrain_Select_list_filter.addAll(gw_sptrain_Select_map.values());
	
			all_map = searchTugroup(gw_sptrain_list);
			select_map = searchTugroup(gw_sptrain_Select_list_filter);
			// 构造数据end
	
			// 生成树
			String cacheName2 = "Tugroup";
			String className2 = Gw_tugroupDO.class.getName();
			int sign = 1;
	
			StringBuffer bf = new StringBuffer();
			
			// 最下层的培训单元组:
			Set set = all_map.entrySet();
			Collection<Long> coll = all_map.values();
			Iterator itr = set.iterator();
			while (itr.hasNext()) {
				Map.Entry entry = (Map.Entry) itr.next();
				Long key = (Long) entry.getKey();
				Object value = entry.getValue();
	
				// 获得根以下的培训单元组
				if (parent_id.equals(((Long) value))) {
					Gw_tugroupDO gw_tugroupDO = (Gw_tugroupDO) Common
							.parseDBCache_Row(cacheName2, key.toString(),
									className2);
	
					// 如果培训单元组被禁用 则不显示 组信息
					if (gw_tugroupDO != null
							&& "Y".equals(gw_tugroupDO.getIsValid())) {
						sign=sign+1;
						boolean check = false;
						if(select_map.containsKey(key)){
							check = true;
						}
						//action
						if(bf.toString().equals("")){
							bf.append("[");
						}
						bf.append("{ name:\"" + gw_tugroupDO.getTrainUnitGroupName() + "\", asyncUrl: getAsyncUrl,open:false, checked:"+check+", isParent:true,id:" + key + ", group:"+key+",trainunit:\"\"},");
					}
				}
			}
			if(sign != 1 && !bf.toString().equals("")){
				String str = bf.toString();
				str = str.substring(0,str.length()-1);
				str = str+"]";
				out.write(str);
			}
			
			StringBuffer bfTrainunit = new StringBuffer();
			if (sign == 1) {
				
				// 最下层的单元组的ID
				// 根据条件 生成培训单元
				String cacheName1 = "Trainunit";
				String className1 = Gw_trainunitDO.class.getName();
				ArrayList gw_trainunit_list = Common.parseDBCache(cacheName1, className1);
				for (int i = 0; i < gw_trainunit_list.size(); i++) {
					Gw_trainunitDO gw_trainunitDO = (Gw_trainunitDO) gw_trainunit_list.get(i);
					Long trainunit_id = gw_trainunitDO.getTrainunit_id();
					// 如果培训单元被禁用 则不显示 单元信息
					if (gw_trainunitDO != null
							&& "Y".equals(gw_trainunitDO.getIsValid())) {
						Long tugroup_id = gw_trainunitDO.getTugroup_id();
	
						if (tugroup_id.equals(parent_id)) {
							boolean check = false;
							for(int k=0;k<gw_sptrain_Select_list_filter.size();k++){
								Gw_sptrainDO gw_sptrainDO = (Gw_sptrainDO) gw_sptrain_Select_list_filter.get(k);
								if(trainunit_id.equals(gw_sptrainDO.getTrainunit_id())){
									check=true;
									break;
								}
							}
							if(bfTrainunit.toString().equals("")){
								bfTrainunit.append("[");
							}
							bfTrainunit.append("{ name:\"" + gw_trainunitDO.getTrainName() + "\",open:false, checked:"+check+",id:" + trainunit_id + ",group:\"\" , trainunit:"+trainunit_id+"},");
	
						}
					}
				}
			}
			if(sign == 1 && !bfTrainunit.toString().equals("")){
				String str = bfTrainunit.toString();
				str = str.substring(0,str.length()-1);
				str = str+"]";
				out.write(str);
			}
		}
	}
	
}


下层动态加载目录:
bf.append("{ name:\"" + gw_tugroupDO.getTrainUnitGroupName() + "\", asyncUrl: getAsyncUrl,open:false, checked:"+check+", isParent:true,id:" + key + ", group:"+key+",trainunit:\"\"},");

根目录:
bfTrainunit.append("{ name:\"" + gw_trainunitDO.getTrainName() + "\",open:false, checked:"+check+",id:" + trainunit_id + ",group:\"\" , trainunit:"+trainunit_id+"},");



获取目录树中有改变的节点:
	function savezTree(){
	//保存目录树
		//有改变的节点
		var srcNode = zTree1.getChangeCheckedNodes();
		//alert(srcNode.length);
		var availableData="";
		var groupID="";
		var trainunitID="";
		for( var i=0; i<srcNode.length; i++){
			//alert("name:"+srcNode[i].name);
			if(srcNode[i].check_False_Full == true && srcNode[i].check_True_Full == true){
				availableData=availableData+","+srcNode[i].name;
				var group = srcNode[i].group;
				var trainunit = srcNode[i].trainunit;
				if(typeof(group)!=undefined && group != null && group != ""){
					groupID = groupID + group +",";
				//alert("group:"+group);
				}
				if(typeof(trainunit)!=undefined && trainunit != null && trainunit != ""){
					trainunitID = trainunitID +","+ trainunit;
				//alert("trainunit:"+trainunit);
				}
			}
			//alert("id:"+srcNode[i].id);
			//alert("group:"+srcNode[i].group);
			//alert("trainunit:"+srcNode[i].trainunit);
		}
		//alert(availableData);
		//alert(trainunitID);
		var specialtyNum = document.getElementById("id").value;
		var positionNum = document.getElementById("positionNum").value;
		//alert(groupID);
		//alert(trainunitID);
		//updateSptrainWJS(groupID,trainunitID,specialtyNum,positionNum);
		if((groupID!=null && groupID!="") || (trainunitID!=null && trainunitID!="")){
			UpdateSptrainDWR.updateSptrain(groupID,trainunitID,specialtyNum,positionNum,function(data){
				if(data==1){
					removeTree();
			     	alert("更新成功!");
				}else{
			     	alert("更新失败!");
				}
	     	});
		}else{
	     	alert("更新成功!");
		}
	}


可参照附件中zTreedemo和zTreeAPI v2.6.chm


分享到:
评论

相关推荐

    JQuery zTree v2.6

    这些示例涵盖了zTree的常用功能,如基本展示、多选、异步加载、拖拽排序等,开发者可以通过查看和运行这些示例,快速掌握zTree的使用方法。 总结,JQuery zTree v2.6是一款强大且易用的树形插件,它的API文档和实例...

    JQuery-zTree-v2.6.rar_Java 8_jquery tree_jquery-ztree-2.6.js_jqu

    2、在一个页面内可同时生成多个 Tree 实例 3、支持 JSON 数据 4、支持一次性静态生成 和 Ajax 异步加载 两种方式 5、支持多种事件响应及反馈 6、支持 Tree 的节点移动、编辑、删除 7、支持极其灵活的 checkbox...

    jquery-zTreeAPI v2.6.zip

    《jQuery-zTree API v2.6详解:打造高效前端树形组件》 在网页开发中,数据的组织和展示方式多种多样,其中树形结构因其层次清晰、逻辑明确的特点,常用于目录管理、组织架构展示等领域。jQuery-zTree是一款基于...

    JQUERY ZTREE 动态树代码

    在提供的JQuery zTree v2.6版本中,包含了完整的文档、示例代码和示例数据,帮助开发者更好地理解和使用ZTREE。通过阅读文档和查看示例,可以进一步掌握ZTREE的高级功能,如节点分组、搜索、权限控制等。 总的来说...

    ztree小例子

    在这个"ztree小例子"中,我们将探讨如何使用最新版本的jquery.ztree-2.6.js来创建一个功能完备的zTree实例。 首先,我们需要了解zTree的基本概念。zTree的核心在于将HTML结构转化为具有交互性的树形数据展示,它...

    zTree插件之多选下拉菜单实例代码

    zTree插件之多选下拉菜单实例代码css和js 代码如下:&lt;!–ztree树结构–&gt;&lt;link rel=”stylesheet” type=”text/css” href=”assets/ztree/css/zTreeStyle.css”...script src=”assets/ztree/js/jquery.ztree-2.6

    zTree插件之单选下拉菜单实例代码

    首先,我们需要引入 zTree 的 CSS 和 JavaScript 文件,它们分别为 `zTreeStyle.css` 和 `jquery.ztree-2.6.js`。这些文件提供了 zTree 的样式和核心功能。同时,还需要引入 jQuery 库,因为 zTree 是基于 jQuery ...

Global site tag (gtag.js) - Google Analytics