jsTree & ajax json call

how to set up ajax call to get data for results nodes

by robgallen

HTML

<script src=" &lt;script type=&quot;text/javascript&quot; src=&quot;http://static.jstree.com/v.1.0pre/jquery.js&quot;&gt;&lt;/script&gt; &lt;script type=&quot;text/javascript&quot; src=&quot;http://static.jstree.com/v.1.0pre/_docs/syntax/!script.js&quot;&gt;&lt;/script&gt; &lt;script type=&quot;text/javascript&quot; src=&quot;http://static.jstree.c"></script>
<script src="http://static.jstree.com/v.1.0pre/jquery.hotkeys.js"></script>
<script src="http://static.jstree.com/v.1.0pre/jquery.jstree.js"></script>
<div id="jstree"></div>

JavaScript

data = [
    {
    "data": "Basics",
    "state": "closed",
    "children": [{
        "data": "login",
        "state": "closed",
        "children": ["login",
        {
            "data": "results",
            "state": "closed",
            "attr": {
                "id": "node-123"
            }}]},


    {
        "data": "Basics",
        "state": "closed",
        "children": ["login", "something",
        {
            "data": "results",
            "state": "closed",
            "attr": {
                "id": "node-456"
            }}]}]},
{
    "data": "All",
    "state": "closed",
    "children": [{
        "data": "AddCustomer",
        "state": "closed",
        "children": ["login", "Add",
        {
            "data": "results",
            "state": "closed",
            "attr": {
                "id": "node-789"
            }}]}]}
]


$(function() {
    $("#jstree").jstree({
        "json_data": {
            "data": data,
            "ajax": {
                "url": "/echo/json/",
                "data": function(n) {
                    // get parent / grandparent node
                    var lists = $(n).parents('ul');
                    var p = $(lists[0]).prev('a');
                    var gp = $(lists[1]).prev('a');
                    // the result is fed to the AJAX request 'data' option
                    return {
                        "parent": $.trim(p.text()),
                        "grandparent": $.trim(gp.text()),
                        "id": n.attr ? n.attr("id").replace("node-", "") : 1,

                    };
                }
            }
        },
        "plugins": ["themes", "json_data"]
    });
});