Questions tagged [jquery-ui-droppable]

The jQuery UI Droppable plugin makes selected elements droppable so they accept being dropped on by draggables.

The Droppable plugin makes selected elements droppable (meaning they accept being dropped on by draggables). You can specify which (individually) or which kind of draggables each will accept.

Useful links


Related Tags

658 questions
57
votes
4 answers

When I make a draggable clone and drop it in a droppable I cannot drag it again

When I make a draggable clone and drop it in a droppable I cannot drag it again. How do I do that? Secondly I can only figure out how to us .append to add the clone to the droppable. But then it snaps to the top-left corner after any existing…
Cudos
  • 5,733
  • 11
  • 50
  • 77
57
votes
1 answer

jQuery Droppable, get the element dropped

A small question hopefully with a simple answer, I am using jQuery draggable and droppable to place items into a dock. Using the below code for the drop. $("#dock").droppable({ drop: function(event, ui) { //Do something…
Pez Cuckow
  • 14,048
  • 16
  • 80
  • 130
48
votes
4 answers

grouping draggable objects with jquery-ui draggable

I want to use jquery draggable/droppable to let the user select a group of objects (each one has a checkbox in the corner) and then drag all the selected objects as a group... I can't figure out for the life of me how to do it haha. Here is what I'm…
Jiaaro
  • 74,485
  • 42
  • 169
  • 190
46
votes
4 answers

How to get jQueryUI drag\drop working with touch devices

This is one situation where I hope someone replies to tell me I'm an idiot. But I continue to be amazed that jQueryUI drag\drop doesn't work with touch devices. I have not tested them all but I have tried iphone\ipad\android 2, 3&4 over the last…
Brian
  • 839
  • 1
  • 10
  • 14
42
votes
6 answers

Accurate drop for draggable element on scaled div

THE PROBLEM I'm having a minor problem dragging elements onto a scalable div container. Once the element is actually in the container, the elements drag fine and work the way they are supposed to. Larger elements that are dragged onto the scalable…
bryan
  • 8,879
  • 18
  • 83
  • 166
39
votes
7 answers

jQuery drag and drop - checking for a drop outside a droppable

My apologies if this was answered in another question, I could not find an answer specific to my problem! I'm trying to test whether a jQuery draggable is being dropped outside of a legal droppable. This would normally be solved 90% of the time by…
35
votes
3 answers

How do I highlight a droppable area on hover using jquery ui draggable

I actually have two questions, the on in the title being the main one. I have multiple div elements on the page marked as droppable. Inside these div elements I have spans that are marked as draggable. I want it so when you are dragging an…
32
votes
5 answers

how to revert position of a jquery UI draggable based on condition

I have an element which is draggable and an element which is droppable. Once the dragged item is dropped on the dropzone I am trying to execute the following jquery psuedo code: if(draggedelement ==…
Mazatec
  • 11,481
  • 23
  • 72
  • 108
29
votes
2 answers

jQuery draggable and droppable between two containers and sortable

Im trying to develop a small page that has the following functionality: Page will have two divs: one being #origin, containing a lot of thumbnail images, and the second one will be #drop, where the images can be dropped on (up to 3 only). it needs…
GR7
  • 5,083
  • 8
  • 48
  • 66
28
votes
6 answers

jQuery Sortable and Droppable

I want to have a list that is sortable, but I also want the elements in that list to be droppable to the divs I have defined as droppable. I can't seem to find a way to do it. Any ideas?
27
votes
4 answers

Jquery Draggable and Backbone.js getting reference to backbone model from inside the droppable success callback

I've got a backbone view model that I'm rendering here and making it draggable with jquery ui. render: -> $(this.el).attr('class', 'item').html(this.template(this.options.model.toJSON() )) viewmodel = this $(this.el).draggable revert: true …
jdkealy
  • 4,807
  • 6
  • 34
  • 56
24
votes
5 answers

jQuery droppable - receiving events during drag over (not just on initial drag over)

I am using jQuery droppable (in conjunction with jQuery draggable) to allow the user to add rows to an HTML table by dragging items from a list and dropping them on the table. This works well, however at present the logic is that when the user…
Richard Ev
  • 52,939
  • 59
  • 191
  • 278
18
votes
1 answer

How to remove animation on revert of jQuery UI draggable?

I tried Googling and couldn't find this, but I imagine it is a fairly simple task. I am trying to get rid of the revert animation (N.B. I want to keep the revert action, just want to remove the animation of it reverting) when you drop from the left…
16
votes
2 answers

jQuery UI Droppable and Sortable - dropping in the correct sort location

I'm working on a project where I'm dragging elements from a 3rd party jQuery control to a jQuery sortable, using a combination of droppable and sortable. This works perfectly fine, except the item being added is always added to the bottom of the…
AaronS
  • 7,649
  • 5
  • 30
  • 56
16
votes
3 answers

jQuery UI drop event of droppable widget firing twice

Firstly, I know this question has been asked before, both in this site and others, but the answers are all rubbish for my scenario (if they're not rubbish entirely), and (at least for the question here: jQuery UI drop event of droppable fires on…
VoidKing
  • 6,282
  • 9
  • 49
  • 81
1
2 3
43 44