Opened 9 years ago
Last modified 7 years ago
#10111 open bug
Over callback of parent with greedy child does not trigger after drop on child.
Reported by: | mmounts | Owned by: | mmounts |
---|---|---|---|
Priority: | minor | Milestone: | none |
Component: | ui.droppable | Version: | 1.10.4 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
When you have nested droppable targets that have 'greedy' set to true, the parent will stop receiving 'isOver' triggers after an element is dropped onto one of its children. This is because 'this.greedyChild' is set on the parent when the draggable component is put over the child, but it is not set back to 'false' when the element is dropped onto the child. Because of this, the parent will be ignored by further drag events until something triggers 'isOut' on one of its children. There needs to be a line that sets 'greedyChild' on a parent element back to false after an item has been dropped onto the child as well as when the item is moved out of the child.
//Run through all droppables and check their positions based on specific tolerance options $.each($.ui.ddmanager.droppables[draggable.options.scope] || [], function() { if(this.options.disabled || this.greedyChild || !this.visible) { return; } ... if (this.options.greedy) { // find droppable parents with same scope scope = this.options.scope; parent = this.element.parents(":data(ui-droppable)").filter(function () { return $.data(this, "ui-droppable").options.scope === scope; }); if (parent.length) { parentInstance = $.data(parent[0], "ui-droppable"); parentInstance.greedyChild = (c === "isover"); } } ...
Change History (10)
comment:1 Changed 9 years ago by
Owner: | set to mmounts |
---|---|
Status: | new → pending |
comment:2 Changed 9 years ago by
Status: | pending → new |
---|
I do not think that the bugs are related to mine. Both of those are related to behavior when you exit a child element, while the bug I am reporting is caused by letting go of the draggable without leaving the element. Here is a quick example:
Steps to reproduce:
- Drag blue box up to the green child element (child should be yellow, parent is red)
- Let go of the draggable blue box without leaving the child (child is green, parent is red)
- Drag blue box up into parent without intersecting the child element (parend is red, should be yellow)
To reset the bug and start getting the correct behavior again (parent turns yellow on hover), drag blue box over the child again and then drag it back to the parent. This is because the setting causing the bug is only reset on the child 'out' handler, not on 'drop'.
I will be working on a fix for this and work on getting a pull request soon if it is approved quickly.
comment:3 Changed 9 years ago by
Status: | new → open |
---|
comment:4 Changed 9 years ago by
I have exactly the same problem. Is it going to be fixed soon? Is there any workaround in the meantime? Thanks in advance.
comment:5 follow-up: 6 Changed 9 years ago by
Here is the fix that I am using, and have in a PR for the library. It has not been responded to yet, but you can use it locally if you still need something:
comment:6 Changed 8 years ago by
It works perfectly! Thanks a lot! Hope the PR is included in next release...
comment:8 Changed 7 years ago by
I have a slightly different scenario in which over propagation to the parent container doesn't work. It could be that it has the same root cause. Therefore, I've logged the following defect.
comment:10 Changed 7 years ago by
https://github.com/jquery/jquery-ui/pull/1273
Works Perfectly for me Thank you
Hi mmounts,
Thanks for taking the time to contribute to jQuery UI. We need a reduced test case that shows the behavior in order to look into this. You can use this as a starting point: http://jsfiddle.net/tj_vantoll/8RtqV/.
Also, please check whether this is a duplicate of #9389 or #9766.
Thanks.