i want to make jstree
as shown below
i want to get last node data with ajax
call which is File 1
and File 2
Note: i'm hardcoding last node data below to simulate ajax
call
Jsfiddle: https://jsfiddle.net/vym16okw/11/
var s = [];
s.push(
{ "id" : "ajson5", "parent" : "ajson2", "text" : "File 1", "date":"12", },
{ "id" : "ajson6", "parent" : "ajson2", "text" : "File 2", "date":"12" }
);
here is what i have tried:
$('#using_json_2').jstree({ 'core' : {
'data' : [
{ "id" : "ajson1", "parent" : "#", "text" : "Simple root node", "date":"2018"},
{ "id" : "ajson2", "parent" : "#", "text" : "Root node 2", "date":"2018"},
{ "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1", "date":"12" },
{ "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2", "date":"12" },
]
} });
$('#using_json_2').on("select_node.jstree", function (e, data){
console.log("node_id: " , data,'original',data.node.original);
var id = data.node.original.id;
var date = data.node.original.date;
$.ajax({
url:'https://jsonplaceholder.typicode.com/users/'+id+'?date='+date,
type:'GET',
success:function(data){
var s = [];
s.push(
{ "id" : "ajson5", "parent" : "ajson2", "text" : "File 1", "date":"12","children": true },
{ "id" : "ajson6", "parent" : "ajson2", "text" : "File 2", "date":"12","children": true }
);
}
});
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<div id="using_json_2"></div>
Please help me thanks in advance!!!!!!!!!
from How to populate data on click on jstree last node via ajax call
No comments:
Post a Comment