欢迎光临
感受代码之美

ztree根据参数动态控制是否显示复选框/单选框(静态JSON数据)

现有全省各地区静态JSON数据,现在想通过Url参数,动态控制是否显示复选框/单选框,实现方式如下:

 var rootNode, isCascadeSelect = '1';
    var urlParamsJson = urlParams();
    var selType = urlParamsJson.selType, isChkbox = urlParamsJson.isChkbox;

    initTree();

    function initTree() {
        // 用于存储树的节点
        var treeNodes = [];

        $.ajax({
            url: area_tree_data,
            async: false,
            dataType: "json",
            type: "GET",
            success: function (result) {
                treeNodes = result;
            }
        });

        // ztree设置
        var treeSetting = {
            data: {
                key: {
                    name: "name"
                },
                simpleData: {
                    enable: true,
                    idKey: "code",
                    pIdKey: "pcode"
                }
            },
            check: {
                enable: selType ? true : false,
                chkStyle: isChkbox == "1" ? "checkbox" : "radio",
                radioType: "all",
                chkboxType: {"Y": isCascadeSelect == "1" ? "s" : "", "N": isCascadeSelect == "1" ? "s" : ""}
            },
            callback: {
                beforeExpand: zTreeBeforeExpand
            }
        };
        // 初始化功能树
        areaTree = ztree.init($("#area-tree"), treeSetting, treeNodes);
        rootNode = areaTree.getNodes()[0];
        areaTree.expandNode(rootNode, null, null, null, true);
    }

    function zTreeBeforeExpand(treeId, treeNode) {
        if (selType) {
            var selectTypes = selType.split(";");
            if ($.inArray((treeNode.level + 1).toString(), selectTypes) == "-1") {
                treeNode["nocheck"] = true;
                areaTree.updateNode(treeNode);
            }
            $.grep(treeNode.children, function (childNode, index) {
                if ($.inArray((childNode.level + 1).toString(), selectTypes) == "-1") {
                    childNode["nocheck"] = true;
                    areaTree.updateNode(childNode);
                }
            });
        }
    }

页面调用地址:http://localhost:8080/html/portrait/area-tree.html?selType=1;2;3&isChkbox=1

赞(0)
未经允许禁止转载:四个空格 » ztree根据参数动态控制是否显示复选框/单选框(静态JSON数据)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址