Get Checked Element in JQuery JStree

Question

I have created one Jquery jstree with JSON object. My tree is working fine

Creating jstree

$("#tree").jstree({
    "json_data": {
        "data": [{
            "data": "pe_opensourcescanning",
            "id": 0,
            "pId": -1,
            "children": [{
                "data": "tags",
                "id": 30,
                "pid": 0
            }, {
                "data": "branches",
                "id": 29,
                "pid": 0
            }, {
                "data": "trunk",
                "id": 1,
                "pid": 0,
                "children": [{
                    "data": "import-export",
                    "id": 28,
                    "pid": 1
                }, {
                    "data": "custom_development",
                    "id": 12,
                    "pid": 1
                }, {
                    "data": "Connectors",
                    "id": 7,
                    "pid": 1
                }, {
                    "data": "support",
                    "id": 6,
                    "pid": 1
                }, {
                    "data": "Installation-Configuration",
                    "id": 5,
                    "pid": 1
                }, {
                    "data": "backup",
                    "id": 2,
                    "pid": 1
                }]
            }]
        }]
    },
    "plugins": ["themes", "json_data", "checkbox", "ui"]
}).bind("select_node.jstree", function (e, data) {
    alert(data.rslt.obj.data("id"));
});

Now i want the "id" and "data" values for each checked nodes. I have tried to write something but unfortunately that doesn't work. Kindly help me how to achieve this goal.

Getting checked nodes

$("#tree").jstree("get_checked",null,true).each(function () { 
    alert(this.data);
    alert(this.id);
});

Answer 1

Your function to get checked nodes is right, the problem is your JSON that is not well-formed; to set property on the tree, so they can't be get from the methods.

You must use the property attr or no data will be set on the node, from the docs:

The attr object will appear as attributes on the resulting li node.

Code:

$("#tree").jstree({
    "json_data": {
        "data": [{
            "data": "pe_opensourcescanning",
                "attr": {
                "id": 77,
                    "pId": -1
            },
                "children": [{
                "data": "tags",
                    "attr": {
                    "id": 30,
                        "pid": 0
                }
            }, {
                "data": {
                    "title": "branches"
                },
                    "attr": {
                    "id": 29,
                        "pid": 0
                }
            }]
        }]
    },
        "plugins": ["themes", "json_data", "checkbox", "ui"]
})

$("#getChecked").click(function () {
    $("#tree").jstree("get_checked", null, true).each(function (i, e) {
        console.log($(this).attr("id"))
    });
});

Demo: http://jsfiddle.net/IrvinDominin/RYhgD/

Docs: http://www.jstree.com/documentation/json_data