Great piece of code, however I’m getting an error in Firefox (using firebug) of sections.each is not a function

It works in IE8 but not Firefox 3+ and Chrome. Any ideas?

Many thanks

Chris

Example and code found at: http://www.paulwesson.com/sortable/

The Problems
- onload, I have to click the expand (+) icon twice to get it to open

- In ‘Topic 1′ I need to be able to drag an entry into ‘Topic 2′
without ‘Topic 2′ being open. On dragging something over a collapsed
container, I’d like that container to automatically expand and allow
me to drop the item into it.

- If both Topics are closed and you expand Topic 2, then Topic 1, you
are unable to drag an item out of Topic 1 into Topic 2

Again, any help would be most helpful.

Thanks
Paul

There appears to be a bug here with IE7. In your example when you drag an item from one topic to another and place it on top of an existing item (just in the right spot), one or more items disappear. If you rearrange that group, they re-appear.

Does anyone have an idea what the problem is?

Found you articles and excellent example on Sortables really useful, thanks for spending the time. I had a need for the boxes to be horizontal and went on my own little journey getting it to work, which I’ve blogged. I couldn’t find any horizontal examples in my endless searching so I’ve extended your example with credit to yourself. Hopefully it will help someone else.

My extension into horizontal Sortables: http://blog.richardchurchill.co.uk/post/2007/11/Scriptaculous-Drag-And-Drop-Sortables-a-horizontal-example.aspx

Many Thanks

/*
Debug Functions for checking the group and item order
*/
function getGroupOrder() {
var sections = document.getElementsByClassName(’section’);
var alerttext = ”;
sections.each(function(section) {
var sectionID = section.id;
var order = Sortable.serialize(sectionID);
alerttext += sectionID + ‘: ‘ + Sortable.sequence(section) + ‘\n’;
});
return false;
var options = {
method : ‘post’,
parameters : Sortable.serialize(’alerttext’)
};
new Ajax.Request(’reorder.php’, options);
}

Here is the PHP code:

$value) {

$sql= “UPDATE menuitems SET (menuType,menuOrder) VALUES (’$value’,'$i’)”;
if (!mysql_query($sql,$connect))
{
die(’Error: ‘ . mysql_error());
}
$i++;
}

?>

I don’t know how to test if the PHP is even getting the results over to it.

Should be a fairly easy question for ya…. In the getGroupOrder() => sections.each loop for debugging this, how would I get the h3 handle name to display rather than the section.id?

Thanks!