drop callback function runs twice in jQueryUI

Reported by:	pragueexpat	Owned by:	rworth
Priority:	major	Milestone:
Component:	ui	Version:	1.1.3
Keywords:	drop callback twice	Cc:
Blocked by:		Blocking:

Description

I have one draggable div and one droppable div. Each is nested in its own absolutely positioned parent div (see file source below). The droppable div has a callback function. The problem is that the callback is running twice. If the droppable div is not nested in the parent the callback runs correctly (once). If the parent is not absolutely positioned, the callback also runs correctly. The problem occurs in IE, Firefox and Opera (no others tested). Greedy parameter makes no difference. draggable.js, droppable.js and mouse.js were downloaded from svn on August 28, 2007.

HTML file: (Firebug console.log will output div id each time callback runs)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<script type="text/javascript" src="/lib/jquery/jquery-1.1.3.1.js"></script>
		<script type="text/javascript" src="/lib/jqueryui/ui.mouse.js"></script>
		<script type="text/javascript" src="/lib/jqueryui/ui.draggable.js"></script>
		<script type="text/javascript" src="/lib/jqueryui/ui.droppable.js"></script>
		<script type="text/javascript" src="/lib/jquerydimensions/jquery.dimensions.js"></script>
		<style type="text/css">
			#textInput1_container{
				border:1px solid blue;
				position:absolute;
				top:25px;
				left:500px;
				z-Index:100
			}
			#textInput2_container{
				border:1px solid blue;
				position:absolute;
				top:25px;
				left:50px;
				z-Index:100				
			}
			.dd{
				height:30px;
				width:30px;
				border:1px dashed red;
			}
		</style>
	</head>
<body>
	<div id="textInput1_container" class="dragdiv">
		Enter text: <input type="text" id="textInput1" name="textInput1" size="40" />
		<div id="drag_textInput1" class="dd drag">Drag</div>
	</div>
	<div id="textInput2_container" class="dragdiv">
		Enter text: <input type="text" id="textInput2" name="textInput2" size="40" />
		<div id="drop_textInput2" class="dd drop">Drop</div>
	</div>

<script type="text/javascript">

$(function(){
	$('.dragdiv').draggable();
	$('.drop').each(function(){createDropTarget($(this))});
	$('.drag').each(function(){createDragTarget($(this))});
});

createDropTarget = function(jObj){
	(jObj).droppable({accept:'.drag',tolerance:'intersect',greedy:true,drop:function(a,b){console.log(this.id)}});
}

createDragTarget = function(jObj){
	(jObj).draggable({helper:'clone'});
}

</script>
</body>
</html>

Attachments (0)

Change History (7)

Changed August 30, 2007 02:05PM UTC by paul comment:1

owner:	paul → rworth

Changed September 19, 2007 02:37AM UTC by rworth comment:2

It seems one of the drops is coming from the element, and the other from the cursor. If you drop the draggable but the cursor is not over the droppable, only one drop is called.

Changed December 02, 2007 12:43PM UTC by nadia comment:3

I'm having exactly the same problem. I hope a fix is soon to come.

Thanks

Changed December 02, 2007 04:27PM UTC by bstar comment:4

I had the same problem. It seems that a second call is made via the mouseup event.

As a quick fix I added this code to the

drop

function of the file

ui.droppable.js

: (after line line 126, release 1.0)

  if ( e.type!="dragstop" ) return;  // don't handle events called via mouseup. TEMP FIX

Changed December 07, 2007 01:52AM UTC by rworth comment:5

resolution:	→ fixed
status:	new → closed

Fixed in rev4063

Changed November 06, 2013 05:55PM UTC by anonymous comment:6

Replying to [comment:5 rworth]:

Fixed in rev4063

The problem still occurs with JQuery UI get from http://code.jquery.com/ui/1.10.3/jquery-ui.js

When changing positionning of parent element to absolute drop event called twice.the problem does not occurs with relative positionning.

Best Regards

Philippe

Changed November 06, 2013 05:57PM UTC by anonymous comment:7

Hi,

I Have forgotten to precise the version of the browser :

Chrome Version 30.0.1599.101 m

Regards,