Persistent drag and drop tree with jQuery, PHP and MySQL – CRUD
Many people asked me how to implement the basic CRUD functionalities for the D&D Tree, so here it is:
Download persistentTreeCRUD.zip
I use the simpletree callback function afterDblClick for the modify functionality, and a simple jQuery click for add and delete. I also used nyroModal for the popup windows.
In this example i reload the page when a CRUD operation is performed, a better implementation should use ajax to modify the tree on the fly.
Is not perfect but it works 
Enjoy!
josh
If you delete a category it returns:
Fatal error: Call to a member function MoveNext() on a non-object in D:blabladelete.php on line 17
Clues to fix it?
Mauro
Ops, sorry about that…
just delete the line 16: $relatedCategory->MoveNext();
ramji
Hi,
Please send me the add/modify/delete example
Ramji
Mauro
You can find it here: http://www.mdgart.com/jQuery/Simple-Persistent-TreeCRUD/persistentTreeCRUD.zip
E-Finity
Is it possible if I place a node on a node that immediately gets into a folder?
When I have everything on 1 level I must stand one page at a sub to have. Then I can just hang in there an existing page and delete the already created page.
My excuse for my lack english
Mauro
Sorry, i’m not sure that I understood your question…
skanda
I think E-Finity refer to problem I have too.
If you drag a child on an other child it doesn’t become a parent. Categories with children have a folder as icon and you can drag in other folders or files, but if u drag a file on an other file the last doesn’t become a folder. Btw, thanks for your time and your work. I’m definitely gonna buy you a coffee
Skanda
I think E-finity has my same problem. Let say, to make it easier, that categories with children are folders (as their icon) and categories without are files (as their icon). If you drag a file on an other file, the last one doesn’t become a folder.
So if a folder has been empty it becomes a file and it can not be a folder again.
Btw, thanks for your time and your work. I’m definitely buy you a coffe
luca
Hi Mauro, thanks a lot for your script, I downloaded your source with CRUD!
It delete and rename categories correctly but if I want to add a category it says in popup:
You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near 'order) FROM category WHERE parent_id = 2' at line 1and if I want to “rearrange” it says:
You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near 'order = 1 WHERE category_id = 1' at line 1. Can I ask you where can be the problem, I’m going crazy!Luca
luca
excuse me mauro, I’ve wrong for a letter in minus. It’s all ok.
Saqib Aziz
@E-Finity
In persistentTree.php, set docToFolderConvert to true. By default it is false. Setting it to true allows you to move a node into another to get parent-child thing.
simon
Where is the demo. Where are the instructions. I am sure there was a demo 6 month ago. Please put one on as it is not that easy to impliment for novice. And if you cant see it beforehand. I can do it, but I dont want to spend an hour fiddling.
I would like to see something similar for wordpress. There is nothing like this functionality on wordpress as a links management, or on any plugins.
Neo
Hi Saqib Aziz,
Thanks very much for your comment. Me too have the same problem and after seeing your comment i have changed the code as you mentioned and its worked fine.
Thanks once again…!!!
Neo
Neo
Hi All,
I have implemented this tree in one of my projects. And i need to implement the “Expand all” and “Collapse all” facility in this tree. If there is solution, Please advice me to implement.
Any help is very much appreciated..!!!
Thanks and Regards,
Neo.
lucien
It’s possible modif this for use with jquery 1.4.2?
lucien
sorry for double post but bug in jquery 1.4.2 is icon “plus.gif” on top of the page and not on the folder.
Jothish
Hi Mauro,
I used your code, downloaded well, its working. I am very happy. Now I am facing a problem with the Jquery verion.
You used, jquery-1.2.6.pack.js.
But in my project I need to use “jquery-1.4.2.min.js”
Program is working . But I have a javascript error while drag and sort the tree in IE8.
can you help me how I can use this in my project ?
regards
Jothish
Rashid
I created a category and it appeared on last. Now I am trying to move another branch under it, but I can’t
Garden Sheds, Garden Shed, Melbourne Garden Sheds, Sydney Garden Sheds
An impressive share, I just given this onto a colleague who was doing a little analysis on this. And he in fact bought me breakfast because I found it for him.. smile. So let me reword that: Thnx for the treat! But yeah Thnkx for spending the time to discuss this, I feel strongly about it and love reading more on this topic. If possible, as you become expertise, would you mind updating your blog with more details? It is highly helpful for me. Big thumb up for this blog post!
Francesco
Hi,
I’m testing with version 1.6.1 of jQuery, but it does not work and gives no error, can you help me?
Thanks
Mauro
Sorry, this code is not maintained from several years.
Kevin
Hello, I use your Persistent Tree but I would create a new subcategory when I drag the category of the sub category do you understand ?