天天看点

ztree插件使用实例

在做树的时候,有时候会用到静态数据加载,有时候会用到动态(数据库里去查的)数据加载

首先我们来看看动态的树是怎么加载的:

function initTree(){

$.ajax({

 type: "POST",

               url:url,

               dataType: "json",

               async:false,

               data:"searchText="+searchText,

               success: function(msg){

var setting = {

                                view: {

                                    showIcon:false,

                                    addDiyDom: addDiyDom,

                                },

                                check: {

                                    enable: false,

                                },

                                data:{

                                    simpleData : {

                                        enable : true,

                                        idKey : "ID",

                                        pIdKey : "PID",

                                    },

                                    key:{

                                        name:"NAME",数据库里的name字段

                                    },

                                },

                                callback:{

                                    onClick:clickNode,

                                }    

                        }

                        if(1===pc||"1"===pc){

                        zNodes=msg.jsa;//msg是返回的 json 对象, jsa是一个list集合(查询的节点数据)

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

//tree_source是ID选择器

}

});

后台代码

PrintWriter out=request.getWriter();

还要设置utf-8编码

Map<String, Object> result = new HashMap();

        result.put("jsa", arrTree);

        out.write(JSON.toJSONString(result));

        out.flush();

        out.close();

静态的树就更简单了,var zNodes=[

 {id:"c_5",pid:"c_1",name:"其他"}] },

{id:"f_3",pid:"f_1",name:"横形"},{id:"f_4",pid:"f_1",name:"竖形"}] },

{id:"t_5",pid:"t_1",name:"一年以内"},{id:"t_6",pid:"t_1",name:"一年以上"}] },

         ];