Заполнение jstree с JSON

Question

Я пытаюсь заполнить jstree. Я работаю над этим всю ночь и ничего не добился. У меня есть сценарий под названием display.php на моем сервере. Она производит этот текст ответа:

[{ 
    "data": "Factory 1: (1-1000)", 
    "state": "closed", 
    "children": [{ 
     "data": 649 
    }, { 
     "data": 108 
    }, { 
     "data": 86 
    }, { 
     "data": 46 
    }] 
}, { 
    "data": "Factory 2: (1001-2000)", 
    "state": "closed", 
    "children": { 
     "data": "No child nodes" 
    } 
}, { 
    "data": "Factory 3: (2001-3000)", 
    "state": "closed", 
    "children": [{ 
     "data": 2435 
    }, { 
     "data": 2951 
    }, { 
     "data": 2313 
    }] 
}, { 
    "data": "Factory 4: (3001-4000)", 
    "state": "closed", 
    "children": [{ 
     "data": 3952 
    }, { 
     "data": 3722 
    }, { 
     "data": 3593 
    }, { 
     "data": 3252 
    }, { 
     "data": 3893 
    }, { 
     "data": 3854 
    }, { 
     "data": 3320 
    }, { 
     "data": 3092 
    }] 
}, { 
    "data": "Factory 5: (4001-5000)", 
    "state": "closed", 
    "children": { 
     "data": "No child nodes" 
    } 
}] 

На основании всей документации (что довольно ужасно), что я мог бы найти, то это должно быть действительным объектом готов передать в объект jstree. Расскажите, как заполнить мое дерево этим объектом JSON.

EDIT

Вот как я пытаюсь вызвать jstree:

$("#treeview").jstree({ 
    "json_data" : { 
     "ajax" : { 
     "url" : "libs/display.php" 
     } 
    } 
    "plugins" : ["themes", "html_data", "ui", "crrm", "contextmenu", "json_data"], contextmenu: {items: customMenu, select_node: true} 
}); 

Answer 1

var loDatas = []; 
$("#maintree").jstree({ 
    "core": { 
     "themes": { 
      "responsive": false 
     }, 
     "check_callback": true, 
     'data': loDatas 
    }, 
    "types": { 
     "default": { 
      "icon": "fa fa-folder icon-state-warning icon-lg" 
     }, 
     "file": { 
      "icon": "fa fa-file icon-state-warning icon-lg" 
     } 
    }, 
    "state": { "key": "demo2" }, 
    "plugins": ["state", "types", "unique", "json_data", "search"] 
}); 

var lsTreeData = [{ 
         "text": "Factory 1: (1-1000)", 
         "state": "closed", 
         "children": [{ 
          "text": 649 
         }, { 
          "text": 108 
         }, { 
          "text": 86 
         }, { 
          "text": 46 
         }] 
        }, { 
         "text": "Factory 2: (1001-2000)", 
         "state": "closed", 
         "children": { 
          "text": "No child nodes" 
         } 
        }, { 
         "text": "Factory 3: (2001-3000)", 
         "state": "closed", 
         "children": [{ 
          "text": 2435 
         }, { 
          "text": 2951 
         }, { 
          "text": 2313 
         }] 
        }, { 
         "text": "Factory 4: (3001-4000)", 
         "state": "closed", 
         "children": [{ 
          "text": 3952 
         }, { 
          "text": 3722 
         }, { 
          "text": 3593 
         }, { 
          "text": 3252 
         }, { 
          "text": 3893 
         }, { 
          "text": 3854 
         }, { 
          "text": 3320 
         }, { 
          "text": 3092 
         }] 
        }, { 
         "text": "Factory 5: (4001-5000)", 
         "state": "closed", 
         "children": { 
          "text": "No child nodes" 
         } 
        }]; 

        $('#maintree').jstree(true).settings.core.data = lsTreeData; 
        $('#maintree').jstree(true).refresh(); 
        $("#maintree").jstree("open_all"); 
        $("#maintree").jstree("deselect_all");