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
3
votes
1 answer

jQuery draggable after drop

I tried to figure out how to make dropped element again draggable to have possibility to drag it back. I have 2 divs with class .cell and I want to be able to drag and drop from both .cell to another $('.users main .col.details form .row.stations…
general666
  • 1,001
  • 2
  • 16
  • 31
3
votes
2 answers

angular dragdrop (using jQuery UI) - disable swapping

I have problem with swapping the dragged/dropped elements. DOM / Angular Structure: angular.module('app', ['ngDragDrop']) .controller('controller', function($scope) { $scope.listItems = [ {name: "some name", title: "title"}, {name:…
3
votes
2 answers

jquery draggable / droppable change snap

I am attempting to create a series of drag/droppable divs. Once div1 has been dropped, i will create a new div and have it snap at a new position. However the snap position remains the same when div1 has been dropped and div2 is being dragged: (…
3
votes
1 answer

JQuery UI set up my own tolerance

I´m working on game for my little baby. I want to change default tolerance in droppable object. I know, that there are default values like touch, fit, intersect and pointer. But in my app it doesn't work correctly, because I want something between…
Kristián Stroka
  • 698
  • 1
  • 8
  • 23
3
votes
1 answer

multiple droppable

I've have multiple droppable divs (which all have the same size) and one draggable div. The draggable div is 3 times bigger than one droppable. When I drag the draggable div on the droppables divs I want to find which droppable has been affected.…
Sune
  • 109
  • 1
  • 9
3
votes
1 answer

Clone element when i start drag and drop it to my gridsystem

I have couple of divs that are representing my components. This components i want to drag and drop to my Gridsystem. But i need to clone them. SO they still in the Component menu so i can drag more of them. GRIDSYSTEM …
3
votes
1 answer

Unable to drop elements in between dropped fields

I have some draggable elements I have some dropped Fields, I can drop the elements into droppable areas easily. But unable to drop the elements from one dropped field to another Here is Jsfiddle Demo To see fiddle how it working click on add div…
3
votes
2 answers

Dragging rows between tables

The idea is pretty simple and it almost works. There are two tables and the user has the option of dragging rows between the two tables. When a row is dragged from table1 to table2, ajax is used in order to update the database with the data that is…
3
votes
2 answers

Centering draggable elements inside droppable using jquery-ui

Below is an example of what I have been able to achieve so far... $(document).ready(function() { $(".item").draggable({ revert: 'invalid', snapMode: 'inner', scroll: false, stack: false, drag: function(event, ui) { …
3
votes
1 answer

Make coordinates of draggable element relative to droppable element after appending to it

I'm trying to make a tool for a website that uses draggable and droppable elements, from jQueryUI. I have one div that contains the elements (draggables) and a div that the elements will be moved to (droppable). They are completely separate divs and…
3
votes
1 answer

jQuery-UI bug causing images moving

I have this Fiddle that I'm planning on incorporating into a website: http://jsfiddle.net/Thaikhan/fGJ59/3/show/ Functioning of the demo: Click an image to send it into the manipulation frame. Double-click the image to remove. Sort the list to…
3
votes
1 answer

How do I append a Sortable row to a table in another tab using jQuery UI?

I have a page with jquery-ui tabs and each tab contains a table. I have set tabs to be droppable and the tables to be sortable. I would like to be able to drag a row from the table inside active tab, drop it on a different tab and have the row…
3
votes
0 answers

jQuery UI: Accessing the droppable that a draggable was dropped on from the `dragstop` event of the draggable

I have a draggable and a droppable. The draggable has a helper which returns back to the location of the draggable itself whenever it is dropped. As far as I can tell, the dragstop event of the draggable triggers when the helper reaches the original…
3
votes
1 answer

Jquery ui drag drop droppable "drop" event

When I make a div droppable and try to set a drop event function it doesn't fire: $('.item').draggable({ }); $('.destination').droppable({ drop: function(event, ui){ console.log('hiii'); } }); It fires when I drop it outside- to the…
dylanjha
  • 2,303
  • 4
  • 28
  • 47
3
votes
1 answer

removing clone and deleting draggable in jQuery's drag and drop

I am still rather new to jQuery and had a question. I am trying to implement a "drag and drop" method where the user can drag items in one list and drop them in "buckets" in another. I seem to have the dragging part down but two things are causing…
jason
  • 3,821
  • 10
  • 63
  • 120