#6075 open bug ()

Opened September 19, 2010 06:27PM UTC

Last modified March 28, 2014 12:34PM UTC

Sortable: nested sortables can cause dragged item to disappear

Reported by: mbmasuda Owned by:
Priority: minor Milestone: 2.0.0
Component: ui.sortable Version: 1.8.4
Keywords: Cc:
Blocked by: Blocking:
Description

When I drag a Sortable, the item I dragged disappears. I am not sure if this is a bug or if I am doing something wrong. I can reproduce this on my Mac running OS X 10.6.4 in both Safari 5.0.2 (6533.18.5) and Firefox Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-US; rv:1.9.2.10) Gecko/20100914 Firefox/3.6.10. Please see attached Quicktime movie for an example of what I am seeing. My code is:

<html>
<head>
  <title>aldksfj</title>
  <script src="jquery/jquery-1.4.2.min.js" type="text/javascript"></script>
  <script src="jquery/jquery-ui-1.8.4.custom.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function() {
      $('.test').sortable({
        connectWith: '.test'
      });
      $('.test').disableSelection();
    });
  </script>

  <style type="text/css">
    .test {
      border: 1px solid red;
      margin: 5px;
      padding: 5px;
    }
  </style>
</head>

<body>

  <div class="test" id="foo_parent">
      <div class="test" id="foo_0_0">One 1</div>
      <div class="test" id="foo_0_1">One 2</div>
      <div class="test" id="foo_0_2">One 3</div>
      <div class="test" id="foo_0_3">One 4</div>
      <div class="test" id="foo_0_4">One 5</div>
  </div>

  <div class="test" id="bar_parent">    
      <div class="test" id="bar_0_0">Two 1</div>
      <div class="test" id="bar_0_1">Two 2</div>
      <div class="test" id="bar_0_2">Two 3</div>
      <div class="test" id="bar_0_3">Two 4</div>
      <div class="test" id="bar_0_4">Two 5</div>
  </div>
  
  <div class="test" id="baz_parent">  
      <div class="test" id="baz_0_0">Three 1</div>
      <div class="test" id="baz_0_1">Three 2</div>
      <div class="test" id="baz_0_2">Three 3</div>
      <div class="test" id="baz_0_3">Three 4</div>
      <div class="test" id="baz_0_4">Three 5</div>
  </div>

</body>
</html>
Attachments (0)
Change History (5)

Changed September 19, 2010 06:30PM UTC by mbmasuda comment:1

Sorry, the movie was too large to attach. The movie can be viewed here: http://www.stanford.edu/~mbmasuda/jquery/sortables-disappear.mov

Changed October 11, 2012 09:07PM UTC by scottgonzalez comment:2

milestone: TBD → 2.0.0

Changed November 03, 2012 07:32PM UTC by petersendidit comment:3

status: new → open
summary: Sortables disappear → Sortable: nested sortables can cause dragged item to disappear

http://jsfiddle.net/petersendidit/4uBuj/

Changed March 27, 2014 03:49PM UTC by tadaa9 comment:4

I have the same problem on Google Chrome Version 33.0.1750.152 (Mac OS X).

I was about to open a ticket before you see it.

Have you seen the following javascript error after the dragged item is disappeared? "Uncaught HierarchyRequestError: Failed to execute 'insertBefore' on 'Node': The new child element contains the parent."

Changed March 28, 2014 12:34PM UTC by tj.vantoll comment:5

Yeah I get that error. I get it with the latest version of jQuery UI as well: http://jsfiddle.net/tj_vantoll/4uBuj/1/