Questions tagged [droppable]

Usually refers to a HTML element that can be dropped onto another element by dragging

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

590 questions
7
votes
2 answers

jquery sortable/draggable double event firing

I have some drag & drop code which works fine as it is. Just have a little query. I've noticed that if I add an alert within the drop function for debugging purposes (eg. alert(draggedItem.text());) it fires the alert twice when I drop something…
WastedSpace
  • 1,143
  • 6
  • 22
  • 34
7
votes
3 answers

jQuery Droppable: dropping outside div?

Is there any way I can get jQuery to perform a function when you drag an item outside a droppable DIV? Let's say that we have draggable or sortable items in a div and you want them deleted if they are dropped outside their parent div. I know there…
kasakka
  • 838
  • 1
  • 10
  • 14
7
votes
1 answer

JQuery draggable: scroll not working when helper: clone is used

I have a folder list type of situation where I can drag items from one folder to another using jquery draggable/droppable. Folder items are draggable and folders are droppable. These are in a div that is small enough to show a vertical scroll bar. I…
Chris Williams
  • 11,647
  • 15
  • 60
  • 97
7
votes
2 answers

Programmatically drag and drop element onto another element

With jQuery UI, is it possible to execute a drag & drop operation using javascript? Example. When the link is clicked, drag the #pony and drop it into the #box. I've tried triggering the drag event but that doesn't seem work…
nice ass
  • 16,471
  • 7
  • 50
  • 89
6
votes
3 answers

jQuery UI remove element when dropped into a div using .droppable

I'm trying to figure out the logic of how to do this. I have many images with only a CSS class name, they are created dynamically. These images are draggable using jQuery UI's .draggable. I need to have a "trash can" that when an element is dragged…
Wyck
  • 2,023
  • 4
  • 28
  • 34
6
votes
1 answer

jQuery droppable bind function on element drop?

How can I bind a function on the drop event, but outside of the droppable() function? $('#list').droppable({ // ... drop: function(e,ui) { // this works... }, }); // ..but I want to bind my function here Is this possible?
Alex
  • 66,732
  • 177
  • 439
  • 641
6
votes
2 answers

How to get the dropped item's id on drop event jquery

When I drop something to jquery droppable, I want to get the dropped items' id. When I did it like this: $("#here").droppable({ tolerance: 'fit', accept: ".one", drop: function(){ id = $(this).attr("id"); …
Logan
  • 10,649
  • 13
  • 41
  • 54
6
votes
2 answers

Getting jQuery sortable, droppable and draggable to work together

I am trying to use jQuery sortable, droppable and draggable to work together. I have 3 lists: a break-point placeholder; report rows; report groups. The user should be able to: Drag as many placeholder copies into the 'report rows' list Drag…
Prisoner ZERO
  • 13,848
  • 21
  • 92
  • 137
6
votes
1 answer

Jquery UI draggable: clone if Ctrl pressed down

I have a list of draggable table cells that can be dropped onto a second table. They are set to clone, as the original table should remain unchanged if items are dragged from it. Now I want to be able to move the dropped elements inside the second…
Mad Scientist
  • 18,090
  • 12
  • 83
  • 109
6
votes
2 answers

jQuery sortable and droppable list

So what i'm looking for is a way for me to use both sortable and droppable on the same element. Lets say i have a list of 5 elements, these are all sortable. What i'm trying to do is when one element is dropped ontop of another one, it will append…
squirreldev
  • 517
  • 2
  • 8
  • 18
6
votes
1 answer

jQuery UI draggable element dropped into sortable

I have a list of draggable items, and I wish to be able to drag them onto a sortable content block. Here’s my markup:
One
Two
David Hellsing
  • 106,495
  • 44
  • 176
  • 212
5
votes
1 answer

revert 'invalid' with grid doesn't return to start position with jQuery UI Draggable

In a nutshell, if you use draggable with a grid and set revert: 'invalid' on draggable items they don't return to exactly the same place you started dragging them from. They return to a place close to where you started dragging them...pretty…
John Hunt
  • 4,265
  • 8
  • 45
  • 59
5
votes
3 answers

Jquery with droppable draggable and resizable is not working as expected

JQueryUI Draggable inside Droppable with resizable doesn't work. Idea is to be able drag elements which are dragged and dropped to div with resize for dropped elements. Working code: http://jsfiddle.net/lukaszjg/GvDLh/ Instructions to reproduce…
user950993
  • 51
  • 1
  • 2
5
votes
1 answer

How to decide whether to accept or reject a jQuery draggable into a droppable

I'm using jQuery and I have the following problem: In my site I have a chessboard with pieces. Every square is a simple div with the background property to show white or black. Over these squares (inside the divs) I've put an img tag referencing the…
Léster
  • 101
  • 1
  • 5
5
votes
1 answer

How can I drop an image to a container and then update the container based on what was dropped to it?

I'd like to be able to drag an image into one of two containers (container 1 and container 2). From there, depending on which container the image was dropped to, I'd like to update that container with a database call (or just update a row in one of…
bob_cobb
  • 2,229
  • 11
  • 49
  • 109
1
2
3
39 40