DataTree (JavaScript library)

It's a pure JavaScript framework and it handles large tree types of data. dataTree is used to simple, fast, and lite weight. CRUD (Create, Read, Update, Delete) options available. latest version 1.01

Usage

+ button use to add family members of selected data.
e button use to edit selected data.
- button use to remove selectd data.

Example

Data Tree

Creatures

Animals(Creatures)

Humans(Creatures)

Women(Humans)

Men(Humans)

Brids(Creatures)

HTML


<script src="DataTree.js"></script>
<link href="DataTree.css">
<div id="datatree"></div>

JavaScript


var tree = new DataTree(
   document.querySelector('#datatree'),
   {name:'Creatures',d:[
	{name:'Animals',d:[]},
	{name:'Humans',d:[
	   {name:'Women',d:[]},
	   {name:'Men',d:[]}
	]},
	{name:'Brids',d:[]}
   ]}
);

//how to use methods
var data=tree.getData();
console.log(data);

Syntax (arguments)


new DataTree(element)
new DataTree(element,data)
new DataTree(element,data,warning)

data = { name: 'name', d[ { name: 'name', d[{...}] ,...}] }

element

Give DOM element, this element is the target place to create DataTree.

data (Optional)

Give object, It's used to load DataTree content of the data.

warning (Optional)

It's a boolean data type (true or false) and the default value is true. confirm the message control parameter. If the given value is true. when try to delete data confirm popup asking 'Are sure to delete'.

DataTree Methods

DataTree.getData()

It's used to get data of DataTree and its return object.

demo : click here print to console log
code : tree.getData();

DataTree.render()

It's use to reprint html element.

code : tree.render();

Upcoming Update in DataTree

Different themes (design options) coming soon. Give your supports.

Donate Download (Github) Download

Contact @ minisuperfiles@gmail.com

Donate | About | Developer#info | Github | Youtube