如何使用JSTREE选择属于特定树(级别)的节点

时间:2016-06-14 12:41:05

标签: javascript jstree

我正在尝试制定一条规则,使用户只选择属于特定树的节点;用户不能有可能选择不同级别的多个节点,如下所示:

the problem

你知道怎么做吗?

提前致谢。

1 个答案:

答案 0 :(得分:0)

如果有人遇到同样的问题,我找到了解决方案:

html部分:

<div id="jstree"/>

javascript部分:

$(function() {$("#jstree").on("select_node.jstree", function (evt, data) {

  var selectedNode= $('#jstree').jstree(true).get_selected(true);

  for(var i = 0, j = selectedNode.length; i < j; i++) {

    if(selectedNode.length > 1){

        var res = selectedNode[i].parents[selectedNode[i].parents.length-2];

      if(data.node.parent != res){
            $('#jstree').jstree("deselect_all");
      }

    }

  }

});

$('#jstree').jstree({
    'core': {

        'data': [{
            "id": "1.0",
            "text": "Fresh Products",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [{
                "id": "2.06.0",
                "text": "Ethnic & Specialty",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": [{
                "id": "2.16.0",
                "text": "Ethnic & Specialty",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.17.0",
                "text": "Natural & Organic",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }],
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.07.0",
                "text": "Natural & Organic",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.08.0",
                "text": "Prepared Foods",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.09.0",
                "text": "Seafood",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.010.0",
                "text": "Seafood",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "2.0",
            "text": "Frozen Products",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "3.0",
            "text": "Store Equipment ",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "4.0",
            "text": "Packaged Grocery",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "5.0",
            "text": "Retail Technology",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "6.0",
            "text": "HBC/Non-Foods",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [{
                "id": "2.090.0",
                "text": "Seafood",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }],
            "liAttributes": null,
            "aAttributes": null
        }]



    },
    "search": {

        "case_insensitive": true,
        "show_only_matches" : true


    },

    "plugins": ["search"]


});

});