Bootstrap treeview example code 

0) Getting Started Install Oct 12, 2021 · If you are using actionable panels and you want the item links to toggle content, you can use the JavaScript we have started learning about in Day 11: Bootstrap 4 Navigation Tutorial and Examples. Před 10 měsíci. bootstrap treeview example code. 3 (>= 1. H (Example: 3) - Parses a 24 hours time. Aug 05, 2021 · Bootstrap Treeview Example Code. This example relies on the browser to compute values for aria-setsize, aria-posinset, and aria-level . From its source code implementation, it is a bit rosso. How to use it: 1. For example, if you want to update a display when a node is selected use the nodeSelected event. Bootstrap TreeView Example - CodePen: Online Code Editor and Bootstrap 5 Tree view plugin MDB treeview plugin is used to show hierarchical information which starts from the root item and proceed to its children and their respective children. 5. lượt xem 48 N4 năm trước. Pas tutorial ini dibuat, versi 3. I also add form for create new category in tree view. Angular tree view. After creating this file add the below code to it. Download ASP. EEE (Example: Mon, i18n support) - Parses the short name of a day. The plug-in name is treeview that you may download from the Github website here. This example shows how to create jquery treeview with Bootstrap 3. For example, expanding a node is possible via the expandNode method. Tree View using jQuery - Part 2 Tree View is a hierarchical representation of information. johnbarnitz. The plugin has features of dynamic search and filter. Collection of free HTML and CSS tree view examples from Codepen and other resources. CSS Lists. Bootstrap Treeview - find node by property value. Demo Download. Bootstrap-treeview select and reverse. New to Kendo UI for jQuery? Download free 30-day trial. Methods provide a way of interacting with the plugin programmatically. EEEE (Example: Sunday, i18n support) - Parses the full name of a day. sitemap. Bootstrap Accordion with Plus Minus Icons. Bootstrap To-Do Lists. checked state. treeview, 1. step 2:Import Dependency Libs. The TreeView component has an option to customize the node structure through the nodeTemplate Jun 05, 2020 · 6 CSS Tree View. bootstrap5 cdn. Gijgo is a set of free for commercial use javascript controls distributed under MIT License. We'll also show you that it's easy to make a Bootstrap site, not look like a Bootstrap site. Disclosure of Material Connection: Some of the links in the post above are “affiliate links. 2); how can i activate selection effect on all chidren of root node on click of root? Refer to my code below, note that you need make sure your data option "multiSelect" is true. Navigation Treeview Example Using Computed Properties. Jun 09, 2019 · Tutorial kali ini saya akan berbagi cara membuat carousel dinamis menggunakan Codeigniter dan bootstrap. . This makes the navigation bar much more interactive. Invokes in-place editing feature to any element of your page. MVC Bootstrap Form Example: Expanding Your Horizons . February 12, 2015 209633 Bootstrap. In this tutorial, we will build step by step dynamic tree structure using bootstrap treeview js in codeigniter 3. 7. ”. bootstrap show modal jquery. 0 plugin Basic example - JavaScript For non-nested elements - paste code of an icon in the item. The appearance is easy customizable using CSS. Free Bootstrap code examples from codepen. com/ Star the source code repo: What is TreeView and How it looks? TreeView is a pattern for the representation of data in the form of the tree so that it becomes easier for users to understand the organization of data in A sample image is given below to get an idea of how TreeView looks like. Feb 07, 2021 · I am using Boostrap 3 treeview as a base tree view code, I have modified this treeview code to work with Bootstrap 4 and Icons. Oleh karena itu kita akan menggunakan Codeigniter versi 3. MDB treeview plugin is used to show hierarchical information which starts from the root item and proceed to itsWe will create bootstrap treeview example using bootstrap 4 and font-awesome. 2. An easy way to integrate a tree widget within your Angular projects. Feb 28, 2020 · Bootstrap Treeview | Hacker News. One of our previous post on Make Treeview from Mysql data by using Bootstrap Treeview plugin with PHP and Ajax and that post has received huge response from readers and request us to make this type of Dynamic Treeview in which we can add or create new node dynamically and make dynamic treeview hierarchical stucture using same Bootstrap plugin using PHP and Ajax. bootstrap time picker 12 hour format. Drag and drop v-treeview (Vuetify Treeview) component. When users activate an item that represents a file name in the below tree, the name of the selected file appears in the read-only edit field next to the tree. Description: For example, when making reports on the front end, the function of select all andBootStrap TreeView. tab-content . Instead of visiting multiple resources to find free menu templates, our collection of 20 covers EVERYTHING. First on renderings: Small BB, directly on the complete Demo code, copy themselves down on the shining see, other details Shahrivar 20, 1400 AP In this tutorial we have created JSON data from MySQL using PHP and passed to Bootstrap treeview plugin to create tree structure. A simple and elegant solution to displaying hierarchical tree structures while levering the best that Bootstrap has to offer. I use jquery for make tree view layout and child relationship with category model for hierarchical data. Load the required jQuery library and Bootstrap 3 framework in the document. col-md-8. Aban 29, 1399 AP Angular 11 TreeView Working Demo with Source Code. If the stylesheet you link to has the file extension of a preprocessor, we'll attempt to process it before applying. 7 Bootstrap Treeview Menu Examples. May 17, 2020 · I simply create categories table and manage end level of child or parent child category with treeview structure in laravel. 1). We allows to free snippets of bootstrap tree menu , you can download full code of bootstrap treeview example code layout. , SiteMapDataSourceWe may require to create dynamic tree structure for category tree etc in our application. Any transformation between the input markup and the desired output is performed via C#. 0. Dependencies Where provided these ,bootstrap-treeview A simple and elegant solution to displaying hierarchical tree structures (i. You can use it when you have a table with parent child relationship and you need to display result in directory structure. Dynamic Treeview with jQuery & Laravel PHP Framework Example. jonmiles / bootstrap-treeview. | NAF | LINK. It offers a API for controlling things down to the element level and it has built-in functionality to load the entire tree with AJAX. bootstrap tabs click event jquery. #r directive can be used in F# Interactive, C# scripting and . May 15, 2018 · Tree View. Blue Theme. HTML. Prev | Next. Most of them have a 4/5-page structure and standard information hierarchy. net code , vb code , c# code , sample aspx code asp net code examples,. Figure 1- Example Folder Browsing) that can browse folders. If you need a background image with different settings have a look at other sections of this docs. June 5, 2020. Columns like these are created by using the class prefix . NET TreeView control bound with a SiteMap. Untuk intall Codeigniter kita harus download terlebih dahulu installer Codeigniter di link ini. Figure 1 - Example Folder Browsing. Sep 03, 2020 · In this bootstrap example help to create table listing with bootstrap 4 and reactjs. Line height of the treeview component. This tutorials will use following dependencies. Simple demo Mar 02, 2021 · 16 Bootstrap Lists. bootstrap table using javascript. Bootstrap TreeView. Oct 13, 2021 · About Treeview Code Bootstrap Example . In twitter bootstrap tree widget snippet i give you three tab with html css and js you can easily get code of bootstrap treeview demo layout. We will create bootstrap treeview example using bootstrap 4 and font-awesome. SelectedNode - gets or sets the selected node within the Tree View control; ClientTreeView. May 12 2017 1:20 AM. Tree View A Bootstrap template, showing a TreeView widget. Bootstrap Treeview Menu Demo / More Info Bootstrap Tree Demo / More Info Bootstrap 3 Left Multilevel Treeview Menu Demo / More Info Bootstrap Treeview Template Demo Ngx Bootstrap Treeview Examples Learn how to use ngx-bootstrap-treeview by viewing and forking example apps that make use of ngx-bootstrap-treeview on CodeSandbox. 14. 0) Getting Started Install See the demo of simple tree view by using Bootstrap. I’ve covered all of the ASP. Please see the sample code below. bootstrap show modal on page load. The DataTables / Bootstrap integration provides seamless integration for DataTables to be used in a Bootstrap page. To add the panels we need the place them in a container with the class . Oct 02, 2017 · 70 Posts. You can also link to another Pen here, and we'll pull the A simple and elegant solution to displaying hierarchical tree structures (i. e. Dynamic Accordion Panel Making, Dynamic Tree Making. The jQuery Treeview plug-in The treeview plug-in is used to create a tree of data that can be presented to the users along with checkboxes. ПОДПИСАТЬСЯ. Trees in Twitter Bootstrap (4). With Bootstrap Tree View, you can manually create a tree or easily populate it with data by binding to hierarchical data sources, including XmlDataSource and SiteMapDataSource. A short while ago, I had a coding requirement that my usual box of tricks couldn't meet: a file system folder browser for a web application. The alternative mode is ‘independent’, which allows one to select parent nodes, but each node is independent of its parent and children. If you also would like to show support or simply give back to Open Source community, please consider becoming a partner. How create treeview or sub listview using jquery and bootstrap. The change comes inside the last div tag in which list is An extended Bootstrap table with radio, checkbox, sort, pagination, and other added features. HH (Example: 14, Leading 0) - Parses a 24 hours time. Default. Snippet by SeanWessell A simple and elegant solution to displaying hierarchical tree structures (i. treeview. I am taking static data but you can convert into dynamic tree menu list using any Bootstrap 4 jQuery Font-awesome. Code of Conduct; This is a basic example of a full-page background image. Add background-image via inline CSS. This ASP. Ngx-bootstrap-treeview. Aug 25, 2018 · Today, i am going to share with you how to create dynamic treeview node from mysql database in codeigniter 3. Download Code Convert to Bootstrap 4. Bootstrap integrates tabbable tabs in four styles: top (default), right, bottom, and left. Job Search. SetSelectedNode - selects the specified node A simple and elegant solution to displaying hierarchical tree structures (i. Jul 06, 2021 · Output: Right-Aligned Navbar : By default, the links on a navigation bar are arranged on the left, To arrange the links on the right side of the navigation bar In this section, we will see that in the navigation bar not only the space in the left but also in the right can be used. Tags as Badges Aug 28, 2019 · How to add Checkboxes with check uncheck to Bootstrap TreeView and get checked node values. Horizontal padding of treeview items. Day 2: Bootstrap 4 Grid. The Treeview plug-in Video See the following section for live examples of using the treeview jQuery plug-in. js v1. Freelancer. 1. This tutorial have following dependencies –. download. This is fully responsive multilevel dropdown navbar code sample. Net. Step 1: Create a New Project. On mobile screens all menu items and their submenus work like accordion. col-md-*. 0) Getting Started Install ReactJS Examples, Demos, Code Loading. (Example: 3 or 03) - Parses a numeric day, but allowing an optional leading zero. When check boxes are displayed, the treeview manages its hierarchy so that when a check box is checked or cleared, the new value is automatically applied to all child nodes and reflected on the parent nodes' state. Learn how to build various types of form layouts such as vertical form, horizontal form and inline from quickly and easily with the CoreUI. DataTables' Bootstrap integration also provides a renderer for the pagination control in DataTables to ensure that the pagination of the table is also styled Mar 03, 2014 · aciTree is a customizable cross-browser treeview control written as a jQuery plugin (requires at least v1. 6. Treeview HTML Code. Just put a URL to it here and we'll apply it, in the order you have them, before the CSS in the Pen itself. May 30, 2021 · 20 All-Around Free Bootstrap Menu Examples 2021. This treeview will look like: The 2 topmost nodes of the treeview will be the continents – here – North America & Asia. expanded state. About Example Bootstrap Treeview Code . 3. The plugin converts the normal horizontal or vertical Bootstrap 4 navigation into a multi-level dropdown or push menu on small devices. Upon reviewing tons of different navigation examples out there, we decided to create our free Bootstrap menu templates that fit any website, blog and online store. MDB treeview plugin is used to show hierarchical information which starts from the root item and proceed to its children and their respective children. Render a collapsible, sortable (draggable) multi-level tree view from hierarchical data, with iOS-style switches that allow the user to toggle on/off the nodes. The parent object will have associated child objects. Posted in Bootstrap. This bootstrap tutorial will use bootstrap 4, axios, and react-bootstrap-table. Bootstrap example of BootStrap TreeView using HTML, Javascript, jQuery, and CSS. Bootstrap Menu Tuner. 0) Getting Started Install The following table lists the available variables for customization. The parent is the node which is higher in the hierarchy and the child the one that is lower. Bootstrap Tree View. skip to package search or skip to sign in. DataTables can integrate seamlessly with Bootstrap 3 using Bootstrap's table styling options to present an interface with a uniform design, based on Bootstrap, for your site / app. 8. It supports images, checkboxes, drag-and-drop, and has a powerful API and template functionality. Define the background height. This is a basic example of a full-page background image. Links. The official Bootstrap examples don't consider entire page layout, but still may be helpful when considering the sidebar content alone. NET Web Forms Controls merges with the client-side responsiveness and render code clarity of Bootstrap framework, bringing you the best of both worlds. In this treeview I will show the relationship between Continents, Countries, States & Cities. haysstanford. This example shows DataTables and the Responsive extension being used with the Bootstrap framework providing the styling. Bootstrap Treeview Examples Learn how to use bootstrap-treeview by viewing and forking example apps that make use of bootstrap-treeview on CodeSandbox. That means less testing than a home-grown solution. October 20, 2021. Net, SQL Server, TreeView. 0) jQuery v2. Aug 22, 2021 · That the transmitted data source directly assigned to create tree view plugins to figure it can also use bootstrap treeview json data example the code world, there are passed. g. stylecow: modern CSS for all browser Node library to fix your css code and make it compatible with all browsers. Note that the dt-responsive class is used to indicate to the extension that it should be Sep 25, 2012 · About. Jun 07, 2019 · 4. The Overflow Blog Securing the data in your online code repository is a shared responsibility All code belongs to the poster and no license is enforced. Bootstrap Vue Treeview Examples. 3 | Download Code, Demos, Examples, HTML + Javascript + CSS Files. The default type is ‘leaf’, which will only include leaf nodes in the v-model array, but will render parent nodes as either partially or fully selected. Webslesson. Bootstrap is a well-tested, stable codebase. […] Oct 12, 2017 · Browse other questions tagged javascript css twitter-bootstrap vue. this tree view menu is very simple to use and implement in your project. Bootstrap tree view menu example. i need to create a page like any of the msdn forum pages , with tree view and i frame that displays the data related to the clicked node , all what i need is when i resize the page is to let the tree-view go up and transform into Drop Down . Create Treeview with Bootstrap Treeview Ajax JQuery in PHP. I'm using Bootstrap Treeview to display hierarchical date. bootstrap-treeview's Introduction. Most BootstrapZero themes are for Bootstrap 3. The node data is retrieved using a call to a Web I am using Bootstrap Treeview from my ASP. In this tutorial i will tell you about creating a dynamic treeview with jquery in Laravel PHP Framework by using single callback function. Jan 5, 2018 - bootstrap treeview menu example code,vertical multiple level menu design,bootstrap treeview plugin,bootstrap treeview demo,responsive vertical menu More information Find this Pin and more on aWEB by Gijgo is a set of free for commercial use javascript controls distributed under MIT License. NET Core TreeView Control. The Tree View control comes with all ngx-bootstrap is an Open Source (MIT Licensed) independent project with ongoing development made possible thanks to the support of our awesome backers. Bug tracker Roadmap (vote for features) About Docs Service status Bootstrap TreeView Example - CodePen: Online Code Editor and The tree is using bootstrap 3. We allows to free snippets of bootstrap tree menu , you can download full code of bootstrap treeview example code layout. Plenty of customization examples such as accordion, selectable, expand, color, and many more. The tree is using bootstrap 3. disabled state. 0) Getting Started Install This Bootstrap example customizes the navbar to have a full width dropdown menu for certain nav items. Also see: Learn Coding Online. write all the code into the file. Collection of free Bootstrap list code examples. Font family of the treeview component. Jan 07, 2022 · Bootstrap Tree View A simple and elegant solution to displaying hierarchical tree structures (i. Instalasi Codeigniter dan Bootstrap-treeview. bootstrap tooltip keep open on hover. Website Demo. Explanation of Code. SetSelectedNode - selects the specified node Aug 22, 2021 · That the transmitted data source directly assigned to create tree view plugins to figure it can also use bootstrap treeview json data example the code world, there are passed. Asked 1 Month ago Answers: 5 Viewed 5 times. Bootstrap treeview example code. NET Examples. Front-End Code. It can load data at one time or in asynchronously. Jan 27, 2022 · Treeview now supports two different selection types. Let's understand each part of the Bootstrap dropdown component one by one. NET Interactive. col-sm-8. Search for jobs related to Bootstrap treeview example code or hire on the world's largest freelancing marketplace with 20m+ jobs. The Tree View control supports selection of nodes with a mouse click. In this example, 1,000 customers are displayed with 15 orders each. Using the Code. Layout. In the second and last part of this article, I will show you how to use your code Bootstrap example of BootStrap TreeView using HTML, Javascript, jQuery, and CSS. error code Problem Description: TreeView's NodeSelected event registration failed, click on the 1. You can follow step by step for crate treeview structure as bellow. io and other resources: buttons, login forms, modal windows, menu, etc. Thank you very much for watching my new video on this channel Code Tube. demo and code. Check this example. js15. Usage. Minimal CSS frameworks for coding demos - avdi. Browsers use the grouping to compute aria-level , aria-setsize and aria-posinset values for the nodes contained in the branch. Learn how to use bootstrap-vue-treeview by viewing and forking example apps that make use of bootstrap-vue-treeview on CodeSandbox. Net MVC Razor. var toggler = document. Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. var tree = [ { text: "Parent 1", nodes: [ { text: "Child 1", Treeview - Bootstrap 5 & Material Design 2. 12. About Treeview Example Bootstrap Code . See the demonstration online with code: See online demo and code. First Steps in Setting Up the Bootstrap Treeview. It offers a quick and easy navigation through websites. js. For this example to work correctly, you must copy the sample site map data, provided after this code example, to a file named Web. Bootstrap 5 Tree view plugin MDB treeview plugin is used to show hierarchical information which starts from the root item and proceed to its children and their respective children. In bootstrap by using list-group-horizontal class you can arrange the list group to horizontal. About Example Code Bootstrap Treeview . Note that only one node can be selected at a time. Bootstrap 5 Tree view plugin. For creating a new XML file navigate to the app > res > layout > Right-click > New > Layout Resource file. length; i++) { toggler[i]. Help us improve our code examples by registering to vote on and add answers. Flexbox is a new layout mode in CSS3. Siblings are items which have one and Jan 04, 2018 · In this vertical menu design we add menu name and url usign javacript array. For further documentation refer to the API Documentation part. A Treeview is a tree like representation of elements in a hierarchical structure. JSFiddle or its authors are not responsible or liable for any loss or damage of any kind during the usage of provided code. The example will also show how to use the checkbox and get theFree Bootstrap Templates. How create treeview or sub listview using jquery and bootstrap. Such as Feb 09, 2021 · bootstrap-tree-view v1. 0) Getting Started Install Oct 02, 2017 · 70 Posts. Join our developer community to improve your dev skills and code like a boss!intelogie / bootstrap-treeview example snippets. The ShieldUI TreeView component is a powerful user interface element for presenting hierrarchical data. TreeView /. It describes ways to align and size elements. With Bootstrap, you can easily create treeview menus using Bootstarp treeview plugin that needs JSON data to be passed to create hierarchical tree In this tutorial we have created JSON data from MySQL using PHP and passed to Bootstrap treeview plugin to create tree structure. Tags as Badges A simple and elegant solution to displaying hierarchical tree structures (i. NET Core specifics in this tutorial. Feb 18, 2021 · After adding this TreeView create a new XML file for your node which we have to display inside our TreeView. Examples #. zip Now please take its reference and correct your code. This control allows you to add nodes to a tree, each of which can have sub items. Start Bootstrap creates free, open source, MIT license, Bootstrap themes, templates, and code snippets for you to use on any project, guides to help you learn more about designing Jul 24, 2015 · This article introduces how to create a parent / child tree view in ASP. Bootstrap treeview is very simple and elegant solution to displaying hierarchical tree structures using bootstrap. Bootstrap Code Examples. Font size of the treeview component. 11. DataTables' Bootstrap integration also provides a renderer for the pagination control in DataTables to ensure that the pagination of the table is also styled The above example demonstrates the most basic form of the Bootstrap dropdowns. Where provided these are the actual versions bootstrap-treeview has been tested against. NET Core TreeView example demonstrates the template functionalities of the TreeView. API. 0) Getting Started Install This section contains seven code examples: The first code example demonstrates how to set up the frames for the second code example. We will learn table listing, pagination and sorting of data into this example. Events are provided so that your application can respond to changes in the treeview's state. step 1:Let's create index. getElementsByClassName("caret"); var i; for (i = 0; i < toggler. Bootstrap styling. Give a name to your file (Here we have given tree_view_node) and click on create. Valor Software employees and contractors are not eligible to use these funds. Tree View. View code. Setelah itu extract filenya lalu copy folder di localhost anda. bootstrap selectpicker get selected value. Parent 1. Vertical padding of treeview items. addEventListener("click", function Checkbox Tree View. The Bootstrap dropdown has basically two components — the dropdown trigger element which can be a hyperlink or button, and the dropdown menu itself. Jun 04, 2021 · Bootstrap Timeline Examples. TreeView. An Optimized Tree View for Twitter Bootstrap. bootstrap-treeview docs, getting started, code examples, API reference and more. You can also link to another Pen here, and we'll pull the CSS from that Pen and include it. #r "nuget: bootstrap. Update of December 2020 collection. In this example below you will see how to do a BootStrap TreeView with some HTML / CSS and Javascript. Back-End Code. That was a responsive. tree({dataSource: treeDataSource}); Here is a working example with data source: httpBootstrap Treeview by Gijgo. In this example, the user can browse a set of pages about foods that is organized into categories. based on Bootstrap form and popover; supported types: text, textarea, select, date; validation on client and server-side A simple and elegant solution to displaying hierarchical tree structures (i. The Tree View control supports binding to a data source, which can be any object that implements the IHierarchicalEnumerable or IHierarchicalDataSource interface (e. The cool thing about it is that if you choose a child element, the parent element gets selected automatically, and if you select the parent, every one of its child elements get selected"bootstrap-treeview preparejson" Code Answer. Jan 11, 2022 · Collapsible Sortable Toggleable Data Tree In JavaScript – Pickle Tree. 0) Getting Started Install Aug 25, 2018 · Today, i am going to share with you how to create dynamic treeview node from mysql database in codeigniter 3. Copy this into the interactive tool or source code of the script to reference the package. Javascript and CSS Source Code. It is a practical approach so we create an example in which we will create a parent object. The plug-in name is treeview that you See the following section for live examples of using the treeview jQuery plug-in. On RubyTapas, I occasionally need to demonstrate web application code. Alerts are available for any length of text, as well as an optional dismiss button. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency. 0) Getting Started Install Now in your HTML files, you can use the tag. Very simple and easily customizable via css, and if you render it on the server, you don't need javascript at all. Let’s create index. Apr 12, 2021 · It's also worth taking a look 👀 at Bootstrap's official sidebar examples. how to set JSON data bootstrap treeview with java. We have make Dynamic Tree Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts. In this example, we use a "ballot box" unicode instead of a caretbootstrap-treeview docs, getting started, code examples, API reference and more. Cristina Conacel Tutorials. 9 adalah yang paling baru. NET and . It has a user-friendly interface that allows you to create bootstrap css drop down menu navbar easily and in no time. What makes each example unique is the creative approach taken by its designer. x, and we've recently introduced new Bootstrap 4 themes. The third code example demonstrates how to bind the TreeView control to an XML data source. This is a treeview with custom checkboxes and indeterminate state created with HTML, CSS and JavaScript. Jul 24, 2015 · This article introduces how to create a parent / child tree view in ASP. com is a plug-in for the jQuery Javascript library. 16. The purpose of this part is to just show some code that you can copy and use straight out of the clipboard. So, if you are working on codeigniter framework then you can quick learn how you can build In this example, we will create "item" table with 'id', 'name', and 'parent_id' column, Then we will create codeigniter route. Preview. var tree = $('#caseview'). Edit. html file and write all the code into the Bootstrap treeview is used to show hierarchical information which starts from the root item and proceed to its children and their respective children. Here is a collection of Bootstrap timeline examples. Ondrej. All widgets are high performance and works great in combination with Angular 2+, Bootstrap 4 and/or jQuery. The markup for this example: Aug 31, 2018 · This Code will generate the required result array. we will add and remove class using jquery method. Select the root node by clicking on it, or expand the root node and select the customized child node. Does anyone know a mature plugin for a treeview in twitter bootstrap? Most things i found so far are. Get the full Uber clone course: www. Load the jQuery Bootstrap tree view plugin's files in the document. Bootstrap Tree View. i am using Bootstrap Treeview (bootstrap-treeview