关于zTree插件的使用

最新推荐文章于 2024-03-21 19:15:08 发布

zhang.kaigang

最新推荐文章于 2024-03-21 19:15:08 发布

阅读量543

点赞数

分类专栏： JSP JS

本文链接：https://blog.csdn.net/u012027874/article/details/53811613

版权

JS 同时被 2 个专栏收录

13 篇文章 0 订阅

订阅专栏

JSP

12 篇文章 0 订阅

订阅专栏

页面中一个输入框后方有个选择按钮，点击选择按钮弹出一个树形框选择

以下是部分代码：

A页面：

</td>

function selectIndustry() {

var url = "${path}/was/tree/xxx_select.jsp?type=radio&unid="+$("# unid").val();

var returnValue =window.showModalDialog(url,0, "dialogHeight=480px;dialogWidth=500px;center=y;resizable=1;status=0;scroll=1;");

if(null != returnValue){

var arry =returnValue.split("|");

$("# unid").val(arry[3]);

$("# deptName").val(arry[2]);

}

</script>

B页面 xxx_select.jsp(暂时写在jsp中)：

String unite = request.getParameter("unite");//级联标志

String chkboxType = "N".equals(unite) ? " {'Y':'', 'N':''}" : "{'Y':'ps', 'N':'ps'}";

String type = StrUtil.formatNull(request.getParameter("type"),"radio");//返回树形的类型(radio：单选框 checkbox：复选框)

String unid= request.getParameter("unid");//获取页面传过来的行业编码值

request.setAttribute("data",new DeptManager().getDataForZTree());

request.setAttribute("path",request.getContextPath());

<HTML>

<HEAD>

${import_jquery}

${import_ztree}

${import_validation}

${import_theme}

</HEAD>

<BODY>

<col>

</td>

<br>

</td>

</tr>

</table>

var zTree;

var allSelectedID="";

var zNodes = ${data};

var setting = {

check: {

enable: true,

chkStyle: "<%=type%>",

chkboxType: <%=chkboxType%>,

radioType: "all"

callback: {

onClick: onClick

data: {

simpleData: {

enable: true

}

};

$(function(){

$("#btnClose").bind("click",doClose);

$("#btnConfirm").bind("click",doConfirm);

//初始化节点数据

zTree = $.fn.zTree.init($("#tree"), setting, zNodes);

//默认选中指定节点

var node = zTree.getNodeByParam("unid", '<%= unid%>');

zTree.selectNode(node);

});

//关闭窗口

function doClose(){

window.close();

}

function doConfirm(){

var checkedNodes = zTree.getCheckedNodes(true);

for (i=0;i<checkedNodes.length;i++) {

var treeNode = checkedNodes[i];

allSelectedID += (allSelectedID == "" ? "" : ",") + treeNode.pId+"|"+treeNode.id+"|"+treeNode.name+"|"+treeNode.unid;

}

window.returnValue = allSelectedID;

window.close();

}

function hideMenu() {

$("#menu").fadeOut("fast");

}

function onClick(e, treeId, treeNode) {

if(treeNode.checked){

hideMenu();

}else{

zTree.checkNode(treeNode, true, null, true);

}

return false;

}

</script>

</BODY>

</HTML>

后台：

/**

* 获取全部数据并转成JSON字符串

public String getDataForZTree(){

JSONArray array = new JSONArray();

try{

String sql = "SELECT UNID,DEPTNAME,PARENTID,HASCHILDREN FROM dept";

String[][] list = JDBCTool.doSQLQuery(sql);

if(industryList.length>1)

for(int i=1;i<list.length;i++){

JSONObject json = new JSONObject();

json.put("id", list[i][0]);

json.put("name", list[i][1]);

json.put("pId", list[i][2]);

if("Y".equals(industryList[i][3])){

json.put("nocheck",true);

}

if("".equals(industryList[i][2])){

json.put("open",true);

}

array.add(json);

}

}catch(Exception e){

e.printStackTrace();

log.error(e.getMessage(),e);

}

//System.out.println(array.toString());

return array.toString();

}