A Free jQuery Plugins with treeview plugin web view display with dynamic tree view as checkable, filterable, collapsible, from a JSON schema. Bootstrap tree view Displaying vertical hierarchical tree structures while levering the best that Bootstrap has to offer.
Licensed under the Apache License, Version 2.0.
Pure Bootstrap 3 Tree View with jQuery : Click
Table of Contents
How to use :
Add with jQuery library with Bootstrap tree and Twitter Bootstrap’s stylesheet are loaded in Html.
<!-- jQuery and Bootstrap ---->
<link rel="stylesheet" href="bootstrap.min.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<!--- Bootstrap tree view plugin's files --->
<link rel="stylesheet" href="bootstrap-treeview.css">
<script src="bootstrap-treeview.js"></script>
Create a placeholder element for the tree view.
<div id="default-tree"></div>
The required JSON structure to hold your hierarchical data.
var myTree = [
{
text: "Item 1",
nodes: [
{
text: "Item 1-1",
nodes: [
{
text: "Item 1-1-1"
},
{
text: "Item 1-1-2"
}
]
},
{
text: "Item 1-2"
}
]
},
{
text: "Item 2"
},
{
text: "Item 3"
}
...
];
Render a default tree view inside the DIV container you just created.
$('#default-tree').treeview({
data: myTree
});
Done
Thanks for make jQuery plugin is developed by jonmiles For more Helpfull for users, please check the demo page or visit the official website.
