working example Jquery UI / PHP / MySql

Before reading on please be sure you have working experience with Jquery UI !!

Please have a look at this fiddle : [url removed, login to view]

And also have a look at this image: [url removed, login to view]

Your job would be to complete the code that you found at fiddle above.

The image is color coded so to say, showing the fiddle when your work is done ;)

Whiles explaining I'll refer to the colors (RED, GREEN, BLUE, PINK, YELLOW) in the image, for better understanding.

1. Items, Tabs & Containers should be managed through 2 mysql tables

- each item, container & tab is = a row in mysql

- items can not contain other items

- only container (BLUE/PINK) and drop zones (RED) can accept other container or items

- all the items, containers and tabs must be created from database!

Example mysql table for Items&Containers:







this would produce a container (BLUE) with 4 items (GREEN) in it.....

Example for TAB table:


1-Proin dolor

2-Nunc tincidunt

3-Proin dolor

this would produce the 3 tabs (YELLOW) in the image.

2. Items are:

- GREEN in image

- simple DIV's like: <div class="item" style="height:20px; width:100px;"></div>

- draggable, droppable, sortable

3. Containers are:


- simple div's <div class="item" style="height:20px; width:100px;"></div>

- can contain (UI accept) items (GREEN)

- can contain (UI accept) container (GREEN)

4. Zones (RED):

- each tab has 3 zones

- zones accept containers (BLUE/PINK)

- zones accept items (GREEN)

- all item- and tab- positions must upon change be saved in a mysql table (sorting of tabs, and sorting of items and position of items (tabs))

I want to be able to add tabs, container and images from database

- when more tabs are added, then new dropzones must be available in each of them as well..

This should be done with only jquery sortable, draggable, TAB / jqueryui and with as little php code as possible!

Please ask when you have questions, please don't bid if you never worked with UI before.


Skills: HTML, jQuery / Prototype, MySQL, PHP

See more: jquery php mysql, jquery mysql, jquery php mysql example, jquery table mysql, tab jquery php mysql, jquery tabs mysql, jquery mysql simple example, sortable jquery example, php mysql jquery tab, jquery tabs working example, jquery width mysql, example jquery table mysql, php mysql jquery, jquery mysql php, working positions, ui job, php fiddle, php color code, no working, mysql questions, look php, jsfiddle net, jquery fiddle, jquery 2, database positions

About the Employer:
( 0 reviews ) Sindelfingen, Germany

Project ID: #1301499

7 freelancers are bidding on average $119 for this job


Thanks invited for this project ...Please see PMB for more details

$150 USD in 3 days
(76 Reviews)

UPDATEJQUERYUI hi sir,please check PMB. thanks ^_^

$50 USD in 2 days
(107 Reviews)

UPDATEJQUERYUI. I can solve this problem....

$100 USD in 5 days
(60 Reviews)

Hi. I will do this to you.Check my reviews please. Check the PMB also. Eduard

$60 USD in 3 days
(18 Reviews)

hii am really excited to do this job.Please check your PM.

$75 USD in 1 day
(2 Reviews)

please see my message and let me know to show my jquery work.

$200 USD in 5 days
(0 Reviews)

hello sir, please chk pmb

$200 USD in 4 days
(0 Reviews)