jQuery AJAX calendar with connected sortable lists

[Sean P Kent]

Hi,
I have a PHP generated calendar that I have integrated with jQuery's connected sortable lists, so I can drag and sort events. This works great, however I'm trying to also integrate it with a mysql database.
Here's the problem:
Each table cell has an id which is the date of that day (2009-11-21), etc..
When the sortable lists are updated I'm trying to get jquery to pass the date (id) of each list to update the database, but it's only grabbing one date (id) and putting all the lists in one date (table cell)

$(function() {
		$('.sortable').sortable({
			connectWith: '.sortable',
			items: 'li',
			revert: true,
			update : function () { 
			var id = $(this).attr('id');
			var order = $('.sortable').sortable('serialize',{connected: true});
			$("#info").load("sort-events.php?date="+id+"&"+order);
			} 
		});
	});

How can I send each id of every sortable list in the ajax request, so I can update the database correctly?
Thanks.

[crh3675]

What is the result of your $_POST vars from within php when "sort-events.php" is called?

print_r($_POST) should give you the output. Recognize that you are not attaching the "order" results to any variables when making the Ajax request:

yours

"sort-events.php?date="+id+"&"+order);

maybe should be

"sort-events.php?date="+id+"&order="+order);

[Sean P Kent]

Thanks for the reply.
The $_POST looks like this:
Array ( [0] => 1 [1] => 1 [2] => 1 ) 2009-11-12
Now this DOES work, but I only get ONE date in the post vars.
Can I somehow serialize all the ids of each table cell in the sortable lists?

I did get this to work by creating a new jquery function for each date in the calendar, but that creates alot of code, and I'm trying to find a better way to do this.
Right now I have got it working by doing this:

foreach ($cal_date as $id) {
?>
	$(function() {
		$('#<?php echo $id; ?>').sortable({
			connectWith: '.sortable',
			items: 'li',
			revert: true,
			update : function () { 
			var id = $(this).attr('id');
			var order = $('#<?php echo $id; ?>').sortable('serialize',{connected: false});
			$("#info").load("sort-events.php?date="+id+"&"+order);
			} 
		});
	});
<?php 
}

So, this DOES work, but is it ok to do it like this? It seems a little wonkey to me, but it does work.

Thanks for the help.