Jquery, drag and drop and save to mysql database?

Question

I have been searching all over the web, i could only found the inettuts-with-cookies, which teach how to use Jquery to perform drag and drop and then save in cookies. Can anyone please show me how to save to database (php and mysql)? I need it badly..

EDIT:

First, I am not php beginner, but a AJAX beginner. Those tutorials are only for 1 column. Does any one have drag and drop and save to database for 2 or 3 columns? PLEASE>>>

Answer 1

This is pretty broad. My first reaction is: go read a PHP beginners book. That being said, you'll need to learn the following:

• Basic PHP / MySQL tutorial
• jQuery AJAX basics, so that you learn how to interact with a web server through AJAX
• jQuery draggable documentation
• jQuery droppable documentation

Then try reading these comprehensive tutorials:

• Drag and drop reordering
• Dynamic Drag'n Drop

Update: Sounds like you should send your data with JSON, which follows a structure similiar to XML. Your best bet is to start at JSON.org. There's also tutorials on the jQuery site regarding their JSON functions for GET and POST.

As for updating multiple columns, you can either do multiple AJAX posts, or use PHP to split apart the passed data and hit the DB multiple times. That's my best guess, based on the info you've posted.

Answer 2

Here are a few links to help you with drag and drop: http://geekswithblogs.net/AzamSharp/archive/2008/02/21/119882.aspx http://www.codeproject.com/KB/webforms/JQueryPersistantDragDrop.aspx It's really easy but you have to write the code based on your specific application.

In the onDrop method, you need to write an Ajax request to POST the data you want to save. The JQuery AJAX API is here: http://docs.jquery.com/Ajax/jQuery.post#urldatacallbacktype

The POST URL should refer to the PHP script which will save the data. On the PHP side, you connect to the DB:

<?php 
     $dbc = mysql_connect('localhost:/private/tmp/mysql.sock', 'root', 'password') or die (mysql_error()); 
     mysql_select_db('database_name');
?>

Then you write an INSERT statement. This is an insert statement for music shows:

$sql_insert = "INSERT INTO shows (date,venue,venueLink,location,comment,time,dateOrder,locComment,confirm_by) VALUES ('".$Date."', '".$Venue."', '".$VenueLink."', '".$Location."', '".$Comment."', '".$Time."', '".$dateSort."', '".$locComment."', '".$confirmAll."')";

$Venue, for example, would be a variable in your AJAX post request. You can get these variables from PHP superglobals:

$Venue = $_POST['venue']

FYI: You can make that query look much better because double quotes actually print variables...I just copied and pasted some noob code I found from a while back. You can worry about making it pretty later.

Answer 3

This one just came out: Sorting items on the fly (AJAX) using jQuery UI Sortable, PHP & MySQL