Editable jquery tree with PHP Codes

This software is a tree structure runs at web browsers and completes its function, like add item, change name, drag & drop and delete item, by using ajax requests. Items in tree view may be in a database table or they may be files or folders in file system. PHP and MySQL(if items are set to be in a database table) softwares are needed to make this software run. This software also uses jquery javascript framework, simple tree plugin.

INSTALL

Set either

DATABASE_PLATFORM or FILE_SYSTEM_PLATFORM

TARGET_PLATFORM

macro in 'includes/config.php' to determine which platform software will run at. for instance:

define ("TARGET_PLATFORM", DATABASE_PLATFORM);

if TARGET_PLATFORM is set to FILE_SYSTEM_PLATFORM, FILE_ROOT macro must be set to full path of root folder address.

for instance:

define("FILE_ROOT", "/home/mekya/public_html/test");

Please make sure that web server user has the right to read and write to the folder specified above.

if TARGET_PLATFORM is set to DATABASE_PLATFORM, Set your database parameters in 'includes/config.php', also you can change TREE_TABLE_PREFIX macro whose default value is 'tree'.

Then create table according to TREE_TABLE_PREFIX macro

 CREATE TABLE  `tree_elements` (
 `Id` int(10) unsigned NOT NULL auto_increment,
 `name` varchar(45) NOT NULL,
 `position` int(10) unsigned NOT NULL default '0',
 `ownerEl` int(10) unsigned NOT NULL default '0' COMMENT 'parent',
 `slave` binary(1) NOT NULL default '0',
 PRIMARY KEY  (`Id`)
 ) ENGINE=InnoDB DEFAULT CHARSET=utf8 ROW_FORMAT=DYNAMIC;

Features

Add item

Right click a item to open the menu, then click 'Add File' or 'Add Folder' to add a child item under the right clicked item

Enter the new item's name into the text field, then press Enter to send an ajax request to server and complete the operation or press Esc to cancel the operation.

Delete item

Right click a item to open the menu, then click 'Delete', it will ask whether you are sure to delete the item, if yes is clicked, an ajax request will be send to server to complete the operation after process is completed succesfully, an item will be removed from tree. Please not to forget that if an item is deleted, all child items beloging to it will be deleted recursively.

Change the position of an item (Drag & Drop)

Use drag & drop method to change the position and order of an item.

Change the name of an item

Right click a item to open the menu, then click 'Edit'.

Enter the item's new name into the text field, then press Enter to send an ajax request and complete the operation or press Esc to cancel the operation.

Expand/Collapse All

Expand/Collapse All menu items are available under Root context menu.

Saving state of the tree in cookies

State of the tree is saved in cookies and restores the state when tree is initialized later, to disable this feature just make "restoreTreeState" false in "js/init.js" file.

Demo

Demo of editable jquery tree with php codes

Support

If you need support to modify and use this software, We can share all information we have for free, so feel free to contact us

License

This software is free. It can be modified and distributed without notification.

Disclaimer

This software guarantees nothing, use it with your own risk. No responsilibity is taken for any situation.

Project Team

Ozan Koroglu - koroglu.ozan@gmail.com

Ahmet Oguz Mermerkaya (mekya) - ahmetmermerkaya@gmail.com

( Any invitation on linkedin.com is welcome http://www.linkedin.com/in/ahmetoguzmermerkaya )