Is there any way to drop the <li> when it is taken out of the conatiner div?

Sep 15, 2011 at 8:32 PM

hi all

i have a requirement in which  i have a container div that contains 3 <ul> on which dragsort is attached stucture is comething like

<div id="container">

<ul id="list1"><li><div>a</div></li><li><div>a</div></li><li><div>a</div></li><li><div>a</div></li></ul>

<ul id="list2"><li><div>b</div></li><li><div>b</div></li><li><div>b</div></li><li><div>b</div></li></ul>

<ul id="list3"><li><div>c</div></li><li><div>c</div></li><li><div>c</div></li><li><div>c</div></li></ul>

</div>

requirement:

these item are dragged & drop in between these lists . but item should not be taken out of the container div (visually not) is there any way to detach the mouse from the item when somone is trying to drag item out of the container div

like there is

 containment: "#containment-wrapper" in jquery  .draggable(
refer  http://jqueryui.com/demos/draggable/#constrain-movement
Coordinator
Sep 30, 2011 at 11:16 AM

I'm afraid to support this you'll need to change the dragsort code. In the setPos function above "this.draggedItem.parents().each(function() {" add the following piece of code. Then you can pass containment as one of the parameters to dragsort like you do for jquery draggable.

if (typeof opts.containment != "undefined") {
	var containment = $(opts.containment);
	var boundary = containment.offset();
	boundary.bottom = boundary.top + containment.height() - this.draggedItem.height();
	boundary.right = boundary.left + containment.width() - this.draggedItem.width();
	top = Math.min(boundary.bottom, Math.max(top, boundary.top));
	left = Math.min(boundary.right, Math.max(left, boundary.left));
}