Skip to main content

Search and Top Navigation

#4358 closed bug (duplicate)

Opened March 18, 2009 08:14AM UTC

Closed July 21, 2009 12:23AM UTC

Last modified January 17, 2010 06:05AM UTC

Nested unconnected sortables fail in IE7 (IE6 not tested)

Reported by: tarjei Owned by:
Priority: critical Milestone: 1.8
Component: ui.sortable Version: 1.7
Keywords: IE Cc:
Blocked by: Blocking:

The following testpage works well in Firefox and Opera but fails when testing in IE:

It contains a list with nested lists in it. I want to to be able to sort between the top level items and between the second level items and move a second level item from one list to another.

The page above works perfectly in Firefox and Opera, but in IE I cannot sort the second level elements ("Sec 1" etc in the page).

When I start dragging the item, then the toplevel is also dragged

so that I move the whole top list - which is not what I want.

I have tried fiddling with the z-index property, but that has not helped.

Also note that I had this markup doing what is should using Dojo 0.4.6.

Attachments (4)
Change History (12)

Changed March 18, 2009 12:02PM UTC by DarkSerg comment:1

Try my example in IE and Safari.

Changed March 18, 2009 12:04PM UTC by DarkSerg comment:2

IE7 and IE6 make problems. I think it is because of mouse events propagation.

Changed March 20, 2009 09:41AM UTC by tarjei comment:3

DarkSerg: "Try my example in IE and Safari. "

Did you mean that I should test the test.builder.1.7.html file in IE?

Changed March 24, 2009 03:12PM UTC by bcg3082 comment:4

I'm experiencing the same issue. I also found bug #4333 with draggables that may be related.

Changed March 27, 2009 08:06AM UTC by bartaz comment:5

I found the same problem with nested sortables.

It still happens in IE8.

I attached very simple test case with nested sortable lists.

Changed May 07, 2009 10:54AM UTC by jzaefferer comment:6

milestone: TBD1.7.2

Changed May 07, 2009 01:22PM UTC by jzaefferer comment:7


Changed May 19, 2009 08:50PM UTC by jz comment:8

I have the same issue with nested sortable. It looks like the mouse events are getting propagated with IE.

Changed May 19, 2009 10:00PM UTC by jz comment:9

I took a look at the sortable code, it seems that the _mouseStart() method is called each time the mouse event is propagated to a parent sortable. (ie, if I I have a nested sortable like #sortable1 > #sortable2 > #sortable3,

then _mouseStart is called for #sortable3, then #sortable2 and finally #sortable1).

Each call to _mouseStart create a difference placeholder which give the results from the screenshot:


In this example, I am my drag start in #subgroup1 and gets bubbled in #maingroup.

Changed May 20, 2009 10:26PM UTC by jz comment:10

I fixed the issue by adding a stopPropagation() in $.ui.mouse._mouseDown().

 	_mouseDown: function(event) {
+		if ($.browser.msie) {
+			event.stopPropagation();
+		};
 		// don't let more than one widget handle mouseStart
 		// TODO: figure out why we have to use originalEvent
 		event.originalEvent = event.originalEvent || {};

The issue was affecting ie6, 7 and 8. This fix works for all of them.

Changed June 09, 2009 02:43PM UTC by comment:11

I confirm, the change above fixes the problem. Maybe consider adding it to production code ?

Changed July 21, 2009 12:23AM UTC by scottgonzalez comment:12

resolution: → duplicate
status: newclosed

Duplicate of #4333 (for draggable).