jquery.ztree的回显

1.html引用

    
    
    
    
    $(function (){
            initZtree('constructionUnitZtree')//id=constructionUnitZtree
    })

2.html页面放置树的展示位置，并将树的id赋值给name="constructionUnit"

3.js

//初始化树
function initZtree(obj) {
    var setting = {
        async: {
            enable: true,
            url: basePath + "/department/checkZtree",
            autoParam: ["id=pid"],
            dataFilter: ajaxDataFilter //点击展开树的时候触发
        },
        view: {
            selectedMulti: false,
            dblClickExpand: false
        },
        check: {
            enable: true,
            autoCheckTrigger: false,
            chkStyle: "radio",//值为checkbox或者radio表示
            radioType:"all",
            chkboxType :{ "Y" : "s", "N" : "s" }//表示父子节点的联动效果，联动
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        edit: {
            enable: false
        },
        callback: {
            onCheck: onZTreeCheck//选中的时候触发
        }
    };
    $.ajax({
        url: basePath + "/department/checkZtree",
        type: 'post',
        dataType: "json",
        async:true,
        success: function (response) {
            if (response) {
                var constructionUnit = $('#constructionUnit').val()
                if(constructionUnit){
                    if (response[0].children) {
                        for(var i =0; i < response[0].children.length; i++) {
                            if(response[0].children[i].id == constructionUnit){
                                response[0].children[i].checked =true
                            }
                        }
                    }
                    $.fn.zTree.init($("#" + obj), setting, response);
                }else{
                    $.fn.zTree.init($("#" + obj), setting, response);
                }
            } else {
                layer.msg(response.message, {icon: 5,time:2000});
            }
        }
    });

}
//树单选时被选择项的回显
function ajaxDataFilter(treeId, parentNode, responseData) {
    var constructionUnit = $('#constructionUnit').val()
    if(constructionUnit){
        if (responseData) {
            for(var i =0; i < responseData.length; i++) {
                if(responseData[i].id == constructionUnit){
                    responseData[i].checked =true;
                }
            }
        }
        return responseData;
    }else{
        return responseData;
    }
};
//选中的时候给html中的隐藏input赋值
function onZTreeCheck(e, treeId, treeNode) {
    $('#constructionUnit').val(treeNode.id)//选中的时候给html中的隐藏input赋值
}

4.树多选时复选框的对应js

//初始化树
function initZtree(obj) {
    var setting = {
        async: {
            enable: true,
            url: basePath + "/department/checkZtree",
            autoParam: ["id=pid"],
            dataFilter: ajaxDataFilter
        },
        view: {
            selectedMulti: false,
            dblClickExpand: false
        },
        check: {
            enable: true,
            chkboxType :{ "Y" : "s", "N" : "s" }
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        edit: {
            enable: false
        },
        callback: {
            onCheck: onZTreeCheck
        }
    };
    $.ajax({
        url: basePath + "/department/checkZtree",
        type: 'post',
        dataType: "json",
        async:true,
        success: function (response) {
            if (response) {
                var constructionUnit = $('#constructionUnit').val()
                if(constructionUnit){
                    constructionUnit=(constructionUnit.substring(0,constructionUnit.length-1)).split(',')
                    if (response[0].children) {
                        for(var i =0; i < response[0].children.length; i++) {
                          for(var j=0;j