Ticket #4934 (closed bug: fixed)

Opened 5 years ago

Last modified 23 months ago

Draggable causes page to always be scrolled to top in FF 3.5.4

Reported by: JMax Owned by:
Priority: minor Milestone:
Component: ui.draggable Version: 1.7.2
Keywords: scroll, firefox, Cc:
Blocking: Blocked by:

Description

I have been developing a parent/child database style relationship page that involves a list of Draggable items, which is connected with a sortable list. Everything works fine, unless the page is scrolled. Then, if the page is scrolled, when you drag the item, the document scrolls to the top of the page.

The parent of the draggables is a div. I have tried setting the css position to be fixed, absolute, or relative, and nothing seems to fix the issue. The parent (containing the draggable items) needs to scroll with the page.

This also seems to be a problem with the Sortable classes as well. I re-arrange items, that you need to scroll down to see, and whenever you drag them, it jumps to the top of the page.

In looking some more into this, it seems as if the problem is when the draggable crosses the original window "opening" location. For example if the window height is 800px, then the scroll jumps to the top when the cursor crosses the 800px point, when the page is scrolled down at all.

Below is the code that I am using to start instantiate the Draggable class:

$("#activities div").draggable({connectToSortable:'#assignments div table tbody', helper: function(event) {var $r = $(event.currentTarget); return $('<div class="ui-widget-header">' + $r.html() + '</div>');}, revert: 'invalid'});

And here is what I am using to create the Sortable class:

$("#tbody").sortable({revert: true, cancel:'h3', containment: 'parent', placeholder: 'ui-state-highlight', forcePlaceholderSize:true, beforeStop: function(event, ui) { receive(event, ui, this); }, stop: function (event, ui) { stop (event, ui, this); }});

Change History

comment:1 Changed 5 years ago by JMax

BTW - in my testing, I came across this page:  http://jquery-ui.googlecode.com/svn/trunk/tests/visual/draggable/draggable.scroll.html. When I used the js from this page, my code worked fine. It is only broken when I use the code as provided by the download on the main jqueryui.com.

THANKS!

comment:2 Changed 5 years ago by joern.zaefferer

  • Status changed from new to closed
  • Resolution set to fixed

So your issue is fixed in trunk then? Then all we need is a new release.

comment:3 Changed 23 months ago by scott.gonzalez

  • Milestone TBD deleted

Milestone TBD deleted

Note: See TracTickets for help on using tickets.