Questions tagged [jquery-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.

API Documentation

77 questions
12
votes
1 answer

JQuery UI: Cancel Sortable upon Droppable Drop

I am using JQuery 1.5.1 and JQuery UI 1.8.11. I have added sortable for a number of items - the task here is to allow drag to sort, this all works fine. But I also want to incorporate droppable, so that the item can be dropped onto a "copy me" area…
musefan
  • 47,875
  • 21
  • 135
  • 185
8
votes
3 answers

jquery draggable containment array values for scaled container

If anyone could help me figure out how to make the draggable elements contained in a div that changes scale based on window size, i'd really appreciate any guidance. If I do: element.draggable({ cursor: "move", containment:…
bryan
  • 8,879
  • 18
  • 83
  • 166
7
votes
5 answers

Creating multiple droppable siblings that at positioned on top of eachother

I am trying to create multiple jquery droppables next to eachother where some parts might overlap, in these cases I want the one that is on top (z-index wise) to be greedy. I have tried setting the greedy: true option in the droppable, but this does…
jeffreydev
  • 1,722
  • 13
  • 31
5
votes
1 answer

Is there a way to drag a row from a JQGrid to a droppable textfield using the gridDnD plugin?

I would like to drag a row from a JQGrid to a text input field and add a column's text from the dropped row to the end of the text in the input. Obviously this is a long way from the answer, but dragging a row from a grid with this set up on it…
icats
  • 959
  • 3
  • 13
  • 24
5
votes
1 answer

Create Carousel after 5 elements has been added

I am using jQuery UI Droppable Cart Demo plugin and I want to create a carousel or arrows once Dropped area reaches 5 elements... If I click on Arrows, remaning should show FIDDLE HTML

Drag

Reddy
  • 1,477
  • 29
  • 79
5
votes
1 answer

Drop() gets called twice with Sortable/Droppable

I have this code right here. I have two problems though: In the receive function, how can we get the element that just got dropped into the sortable? Not the one that was used to drop a new one, but the actual one that got dropped into the…
abisson
  • 4,365
  • 9
  • 46
  • 68
4
votes
2 answers

If an item was not dragged to a specific location, then have it go to back to original position?

I made a quick drag and drop type menu. Basically I made it so you drag an item from a list into the trash div, and it will give you an alert saying "gone" I want to make it so that you can't just drag the item anywhere. It has to go into the trash…
Bradley Mitchell
  • 277
  • 2
  • 5
  • 14
4
votes
0 answers

Drop elements inside iframe only else revert

EDIT:1 This is drag.html (main page) - jQuery UI Sortable - Handle empty lists
Dharmesh
  • 1,039
  • 1
  • 12
  • 17
4
votes
1 answer

How do I use jQuery UI widgets safely within the Meteor framework?

jQuery UI is not yet a Meteor "package", and even if it eventually becomes one, there will be newer jQuery and jQuery UI versions, and other jQuery plugins that one might want to use with Meteor. There are a variety of issues that arise: Load via…
jpeskin
  • 2,801
  • 4
  • 28
  • 27
3
votes
1 answer

Clone draggable after dropping in targeted area with jQuery UI

I want some images to drop in a targeted area as many times as possible. But the image drops for only one time. My jQuery UI code: $(function() { $( ".draggable img").draggable({ revert: "invalid", appendTo: "#droppable", …
3
votes
1 answer

Getting setTimeout to work

I have the following code which uses Jquery UI Drag and Drop. When the item is dropped into the area, the drop zone changes into the company logo, then I want a delay and a redirect to the URL within the dropped link. I can get the logo to change OR…
2
votes
1 answer

Jquery-ui. Trouble using "draggable", "sortable", and "tabs" together

I started out with this working drag and drop example here. It works great however when I try to place the drop regions within tabs(Here) it seem to break. It stops working when I try to drop an item on the "sortable 2" tab. Hope this makes…
RayLoveless
  • 19,880
  • 21
  • 76
  • 94
2
votes
3 answers

jQuery Droppable - Dont remove Original CSS class of
  • Tag after dropping
  • I am using jQuery UI Droppable plugin... Somehow, my Draggable
  • element Class is getting removed after dropping. :( How can I maintain the same CSS class for
  • tag after dropping the element AFter dropping the
  • Item 1
  • to…
    Reddy
    • 1,477
    • 29
    • 79
    2
    votes
    1 answer

    drag and drop inside nested Divs

    This is my requirement, I have an item called dragItem to drag and Drop. I have 2 Divs, Outer and inner I need to do in this order - Drag the dragItem in the outer Div (So that I do some of my functionalities. At this point only the next…
    Sri
    • 1,505
    • 2
    • 18
    • 35
    2
    votes
    1 answer

    how to drag only child elements inside nested ul tags using jquery ui draggable

    My list is something like this
    • Parent1
        child1
    • Parent2
        child2
    Sukanya Moorthy
    • 109
    • 1
    • 2
    • 10
    1
    2 3 4 5 6