Bootstrap Dynamic Tree View With jQuery Plugin – bootstrap-treeview

Dynamic Tree View Plugin With jQuery And Bootstrap
File Size: 10.59 KB
Views Total: 9180 views
Last Update:June 14, 2024
Publish Date: December 19, 2013
Official Website: Go to website
License: MIT
Plugin Author: jonmiles
Demo    Download

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

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="//"></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.

  data: myTree


Thanks for make jQuery plugin is developed by jonmiles For more Helpfull for users, please check the demo page or visit the official website.
List Of Version :
  • v1.2.0
  • v1.1.0
  • 1.0.2
  • 1.0.1
  • 1.0.0


Mady Schaferhoff is an expert jQuery script at jQuerypost. He offers web development services to clients globally. He also loves sharing Html,CSS, jQuery knowledge through blog posts like this one.