Questions tagged [jquery-ui-draggable]

The jQuery UI Draggable plugin makes selected elements draggable with mouse movement.

The Draggable plugin makes the selected elements draggable with mouse movement.

Enable draggable functionality on any DOM element. Move the draggable object by clicking on it with the mouse and dragging it anywhere within the viewport.

Best part is that it is very easy to use. See this example:

<script>
    $(function() {
        $( "#draggable" ).draggable();
    });
</script>

For more information visit- jQuery UI - Draggable Demos and the API Documentation


Related Tags

1817 questions
0
votes
3 answers
0
votes
1 answer

How to use jQuery draggable stack option on an id not a class

I create draggable, resizable pictures and want the last one dragged (and if possible clicked) to be on top. Each div has it's own id and all have the class 'rectangle'. The jQuery example initiazies using a class ".selector": $( ".selector"…
0
votes
1 answer

Accessing form data from a jquery dialog when clicking on a button

Please forgive Title - tough to explain I am dragging a to another droppable div. The dropped span has a clickable object on it. When I click on it, the jquery dialog opens up. I fill out the dialog with fields When I click on another button, I get…
motti10
  • 63
  • 1
  • 2
  • 11
0
votes
0 answers
0
votes
1 answer

How to update a collection on jQuery (drag and) drop

I'm building a Meteor app that let's the user organize lists of items in tags. I use jQuery draggable and droppable to update a collection when a user drags an item from one tag to another. I find it hard to understand how/where/when I should call…
0
votes
1 answer

JQuery UI draggable destroy, then draggable again not works

I use the jquery ui draggable, droppable plugins. I wrote this code: $(".droppable").draggable({ containment:"window", appendTo:$("#canvas"), helper:"clone", scroll:false }); $("#canvas").droppable({ accept:".droppable", …
mudlee
  • 680
  • 12
  • 22
0
votes
1 answer

jQuery UI - after dragging the item is not draggable

I have problem with dragging between columns. The first drag works OK, but when I want to move to the other cell, It does not work (I can only sort). When I remove helper: "clone" everything works OK, but table is messy (cells "jumping") while I…
kuba1999
  • 499
  • 1
  • 5
  • 12
0
votes
1 answer

Draggable is not fit into droppable when dragged back

I am new to the Draggable and Droppable plugin. Here the codepen lin of my app http://codepen.io/anon/pen/qEMVwE This is how it works, 1. We can drag the div element (Blue color) with in the tag. 2. We can place two div in the same…
0
votes
1 answer

jqgrid draggable not working after paging

I am using draggable jqgrid.But the issue is the rows are draggable only in the first page.After I change the pagination, the draggable for rows is not working.Can you please help me. Below is my code for making jqgrid rows draggable. function…
sandeep.mishra
  • 825
  • 4
  • 19
  • 40
0
votes
1 answer

jquery-ui-rails draggable and droppable function does not work

I am using jquery-ui-rails gem. I want to implement a simple example of draggable and droppable. This is the javascript file: $('.draggable_images').draggable(); $('#droppable1').droppable({ drop: function(event,ui){ …
inquisitive
  • 3,738
  • 6
  • 30
  • 56
0
votes
1 answer

jQuery draggable overlaps with multiple droppable, wrong drop

I have created this fiddle http://jsfiddle.net/v3L7A/14/ $(function () { $('#draggable').draggable({ helper: 'clone' }); $('#droppable1, #droppable2').droppable({ drop: function (event, ui) { $(this) …
0
votes
1 answer

jQuery drag and drop replace element and dynamically create droppable

I have draggable elements that can be dropped into a container. Within the container is a target 'p' for the user to drop the element on. When dropped, the element replaces the target and dynamically creates a new target. This works great the first…
0
votes
1 answer

jQuery draggable - Drag small image inside parent

I have an image (small circle) that I want to drag on top of another bigger image (an axis). How do I set the bigger image as the parent to contain the circle? Below is what I tried, but the circle cannot be dragged on top of the entire big image,…
ItM
  • 301
  • 1
  • 5
  • 16
0
votes
1 answer

Draggable snap to class but not to specific item

I try Jquery UI Dragabble, and I want to snap to a class of elements, but to not snap to an element which is part of that class (Sorry for my English). I mean something like this: $( "#selected" ).draggable({ snap: ".elements", snapCancel:…
Tamás
  • 950
  • 2
  • 10
  • 29
0
votes
1 answer

jquery droppable only working on first 50% of the width (bug??)

I am using draggable and droppable. I got one div per line, each are droppable. Then I have one div, that is draggable. I have noticed that this only works on the first 50% of the divs width. So if I set droppable div to 600 pixels, the droppable…