#9040 closed bug (duplicate)

Opened February 01, 2013 02:02AM UTC

Closed February 02, 2013 02:53AM UTC

Last modified February 02, 2013 05:37AM UTC

"Uncaught TypeError: Cannot read property 'left' of null" when dragging an element over a sortable

Reported by: leoquijano Owned by: leoquijano
Priority: minor Milestone: none
Component: ui.draggable Version: 1.8.18
Keywords: Cc:
Blocked by: Blocking:
Description

Hi,

When configuring a droppable area inside of a sortable:

<ul class="mainSortable">
  <li>
    <div class="dropZone"></div>
  </li>
  ...
</ul>

<ul class="anotherSortable">
  <li class="item"></li>
  ...
</ul>

...

jQuery(".mainSortable").sortable({
  refreshPositions: true,
  ...
}

jQuery(".anotherSortable").sortable({ ... });

jQuery(".dropZone").droppable({
  accept: ".item",
  ...
});

And using the "refreshPositions" option on the main sortable, it will fail if an element in the main sortable is removed. The droppable "refreshPositions" method will try to re-calculate positions for all items, even for the removed ones, and jQuery will break with an "Uncaught TypeError: Cannot read property 'left' of null" error.

The offending code inside the refreshPositions() method in jquery-ui.1.8.18.custom.min.js:

var p = t.offset();
item.left = p.left;
item.top = p.top;

I'm adding an IF statement to prevent this, and allow the refreshPositions method to ignore the non-existing item on the main sortable.

var p = t.offset();
if(p) {
  item.left = p.left;
  item.top = p.top;
}

Since I don't see an attach option, patch information is included below:


--- <html>jquery-ui-1.8.18.custom.min.js (<b>12-dic-2012 20:33:51</b>)</html>
+++ <html><b>Current File</b></html>
@@ -1165,8 +1165,10 @@
 			}
 
 			var p = t.offset();
+      if(p) {
 			item.left = p.left;
 			item.top = p.top;
+      }
 		};
 
 		if(this.options.custom && this.options.custom.refreshContainers) {
Attachments (0)
Change History (4)

Changed February 01, 2013 03:15AM UTC by tj.vantoll comment:1

owner: → leoquijano
status: new → pending

Hi leoquijano, thanks for taking the time to contribute to the jQuery UI project. In order to look into your ticket we're going to need a test case that shows the issue and that it still exists in the latest version.

You can use this to get started - http://jsfiddle.net/tj_vantoll/wjxe4/.

Thanks.

Changed February 01, 2013 04:11AM UTC by leoquijano comment:2

status: pending → new

Here's a jsFiddle that will reproduce the problem. It's actually related to the "toleranceElement", so I didn't have to include the secondary sortable or the droppable configuration.

http://jsfiddle.net/wjxe4/34/

Changed February 02, 2013 02:53AM UTC by tj.vantoll comment:3

resolution: → duplicate
status: new → closed

Duplicate of #6921.leoquijano,

I'm going to close this as a duplicate of #6921 because this appears to be the same problem you're experiencing. #6921 has a pull request that suggests essentially the same patch that you are proposing.

Changed February 02, 2013 05:37AM UTC by leoquijano comment:4

Seems like that's the case. Ok, thanks :-)