Return to Snippet

Revision: 55322
at February 2, 2012 11:56 by flipace


Initial Code
<script type="text/javascript">
	$(function(){		
		addDraggableTo($('.weekplaner-task'));
		$('.weekplaner-daybox ul').droppable({}).sortable({
			revert: true,
			stop: function(e,ui){
				$(ui.item).attr('style','');
				addDraggableTo(ui.item)
			}
		});
	});
	
	function addDraggableTo(sel){
		sel.draggable({ containment:'#weekplaner-wrapper', 
						connectToSortable: '.weekplaner-daybox ul', 
						opacity: 0.7, 
						helper: function(){ return this }
					});
	}
</script>
<div id="weekplaner-wrapper">
<?php for($i = 1; $i <= 5; $i++){ ?>
	<div class="weekplaner-daybox">
		<ul>
			<li class="weekplaner-task">remedia</li>
			<li class="weekplaner-task">remedia</li>
		</ul>
	</div>
<?php }	?>
	<div class="clear"></div>
</div>

Initial URL


Initial Description
A little snippet which allows simultaneous use of jquery sortable, draggable and droppable on the same element

Initial Title
jQuery - synchronous use of draggable, droppable and sortable

Initial Tags


Initial Language
JavaScript