Archive for the ‘jQuery’ Category

Persistent drag and drop tree with jQuery, PHP and MySQL – CRUD

Posted on the August 4th, 2009 under Javascript, MySQL, PHP, Programming, jQuery by Mauro

Many people asked me how to implement the basic CRUD functionalities for the D&D Tree, so here it is:


download 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!

Donate 1 euro, buy me a coffee, I need it to write more posts! Thanks ;)

Persistent drag and drop tree with jQuery, PHP and MySQL – part 2

Posted on the March 29th, 2009 under Javascript, MySQL, PHP, Programming, jQuery by Mauro

In this second part of this article (this is the first part) i’m going to show you how to retreive and serialize the tree structure using jQuery and sent the serialized data to a php script (using ajax) that saves it on the database. In this way, we can have the persistence of any change made on the tree.

Donate 1 euro, buy me a coffee, I need it to write more posts! Thanks ;)

Persistent drag and drop tree with jQuery, PHP and MySQL – part 1

Posted on the March 15th, 2009 under Javascript, MySQL, PHP, Programming, jQuery by Mauro

I’m developing a website that have a catalog with nested categories; this categories are also ordered and with a not predefined depth levels. I needed to find a way to manage with category in a fast and intuitive way for the user, so i decided to use a directory like tree allowing the users to drag and drop the categories to change the order and even the position on the tree: of course i use jQuery to do this, and PHP/MySQL to save the structure of the tree in a database.
I found a nice tree jQuery plugin on the web, that i used as a starting point for my project: http://news.kg/wp-content/uploads/tree/. The plugin work well on all browser i tested (FF3, Safari 3, IE6, IE7). It provide the drag and drop funcionality and some interesting callback, like afterClick and afterDblClick.
But let’s start from the beginning.

Donate 1 euro, buy me a coffee, I need it to write more posts! Thanks ;)