Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Select an option

  • Save documentprocessing/0ba19b93e7cef3a94e40f4ee9686fdb0 to your computer and use it in GitHub Desktop.

Select an option

Save documentprocessing/0ba19b93e7cef3a94e40f4ee9686fdb0 to your computer and use it in GitHub Desktop.
Basic JSON Tree from JSON
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Basic jsTree from HTML</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.12/themes/default/style.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.12/jstree.min.js"></script>
</head>
<body>
<div id="htmlTree">
<ul>
<li>Root Node
<ul>
<li>Child Node 1</li>
<li>Child Node 2
<ul>
<li>Grandchild 1</li>
<li>Grandchild 2</li>
</ul>
</li>
<li>Child Node 3</li>
</ul>
</li>
</ul>
</div>
<script>
$(document).ready(function() {
$('#htmlTree').jstree({
'core': {
'themes': {
'responsive': true
}
}
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment