Currently i have this code written
<?
require('db.php');
$demo = new SortableExample();
$list = $demo->getList();
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="js/prototype.js"></script>
<script src="js/scriptaculous.js"></script>
<script>
Event.observe(window,'load',init,false);
function init() {
Sortable.create('listContainer',{tag:'div',onUpdate:updateList});
}
function updateList(container) {
var url = 'ajax.php';
var params = Sortable.serialize(container.id);
var ajax = new Ajax.Request(url,{
method: 'post',
parameters: params,
onLoading: function(){$('workingMsg').show()},
onLoaded: function(){$('workingMsg').hide()}
});
}
</script>
</head>
<body>
<div id="listContainer">
<?
foreach($list as $item) {
?>
<div id="item_<?=$item['catid'];?>"><?=$item['category'];?>
</div>
<?
}
?>
</div>
<div id="workingMsg" style="display:none;">Updating database...</div>
</body>
</html>and what i would like to do is connect those sortables with image layers (sort of a Photoshop, but you cant do anything else but reorder layers) so when you click on item icon, new layer appears on the list of all layers and item image appears on the avatar... does anybody know how to do that?