Opened 8 years ago

Last modified 5 years ago

#6075 open bug

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>

Change History (5)

comment:1 Changed 8 years ago by mbmasuda

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

comment:2 Changed 6 years ago by Scott González

Milestone: TBD2.0.0

comment:3 Changed 6 years ago by petersendidit

Status: newopen
Summary: Sortables disappearSortable: nested sortables can cause dragged item to disappear

comment:4 Changed 5 years ago by tadaa9

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."

comment:5 Changed 5 years ago by tj.vantoll

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

Note: See TracTickets for help on using tickets.