I am having a probelm with the z-index of my sortable object not being above my droppable. If you visit http://clareshilland.unknowndomain.co.uk/. Press Ctrl + L to bring up the login screen. Enter the username clare and the password shilland. It will then load in the admin bar and if you click manage gallery. A pop down thumbnail view...
Hi there, I have some drag and drop functionality on my website, I am wanting to hightlight the area that is droppable with a chage in border color when the draggable element is clicked/starting to be dragged. If the click/or drag stops I want the border of the droppable element to change back to its origianl state, I currently have th...
Hi, I have a list (List1) which I can drag boxes from, and two lists where I can drag List1 boxes to (List2 & List3). I have 'sortable' code for List2 & List3 which reformats what I've dragged from List1 (eg. it changes the colour of the box etc using the 'receive:' function. Say List2 boxes turn blue & List3 boxes turn red). The code ...
I have a simple application that users jquery-ui's draggable and droppable. In Firefox, it works perfectly. In Chrome, however, I'm having problems. This is the code: $(".cell").droppable({ drop: function(event, ui) { var originalTarget = event.originalTarget; ... } }); In Chrome the 'event' obj...
I'm trying to drop a large box onto a smaller box. The large box seems to be 'over' the box only when its very center is inside the smaller box. Can I change the part of the big box which needs to be over the smaller one? Why? Because it all works fine until I add a containment. When the small box is near the edge of the containment t...
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 to the element dropped?!? } }); However I couldn't find a way to get...
Ive 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 affeckted. My code looks like this: $(function () { $(".draggable").draggable({ drag: f...
I have a sortable list (of tasks). It helps prioritize tasks, so I want to keep this functionality. Now I want to add subtasks to the functionality: I want to enable users to drag one task over to another task and drop it there to turn it into a subtask. Applying .draggable() and .droppable() to items that are already sortable has no e...
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 == value){ $(draggedelement).hide(); } else{ $(draggedelement).revert(); } where the revert() function moves the dragged item back to it...
I am testing out the Jquery droppable photo manager demo: http://jqueryui.com/demos/droppable/#photo-manager Currently when the photo is deleted it is moved to the trash bin. How can I have it copy the image and move it to the trash bin so that it appears in both places?? This is the code: <script type="text/javascript"> $(fu...
I am trying to show a $f00x$f00 grid (20x20 or 30x30 etc) (with gridlines) that an image can be dropped onto. I'm not sure how to get the grid to display does anyone have any ideas? ...
Hi, Looking at the jquery demo at http://jqueryui.com/demos/droppable/#photo-manager, I'm trying to make the images in the Trash undraggable and am unable to do so. I've changed the demo so that the Gallery is no longer droppable, but the items in the Trash still follow my cursor if I mousedown. Of course, they have nowhere to go, so ...
I have a problem where the element calls .show() when the draggable triggers drag, does not let me drop into the droppable. How can I fix this? $(document).ready(function() { $(".folder").droppable({ greedy: true, drop: function(event, ui) { $(".folder").hide(); }, tolerance: 'touch' }); ...
I'm not sure of the best way to do this, I am certain that my JQuery is "clumsy" to say the least but it gets the first part of the job done. I am dragging "products" to a basket like this: $j('#basket').droppable({ accept: '.productsimg', drop: function(ev, ui) { $j(this).append(ui.draggable.clone()); $j("#basket .de...
Hello all, I'm working on an interface for dragging and sorting questions and their choices. I have a toolbar on the right with the available questions/choices and the list of current questions/choices on the left. The list on the left is a droppable and a sortable. The items in the list on the right are all draggable and connected to t...
I have a list of tasks that are all draggable and droppable. All of them have an 'over' event handler to make sure they light up when another task is hovering over them. This is not working fully as I want it to. When I start dragging one task, the other tasks don't light up as expected, except when the mouse is not actually above the d...
I have a droppable with a drop event handler: $(this).droppable({ drop:function(){ console.log('OMG You Dropped It!'); } }); I have a draggable: $(this).draggable(); What I want to do is trigger the drop event handler on the droppable without actually dragging and dropping the draggable. I want to simulate the actual behavi...
cont from here: http://stackoverflow.com/questions/1444469/jquery-droppable-accept $(".droppable").droppable({ accept: function(d) { if(d.hasClass("foo")||(d.attr("id")=="bar")){ return true; } } }); what if i wasn't targeting an element but a set of elements? like "ul#moo li" for example. how wou...
If I have a table with a lot of cells, lets assume 50 rows x 50 columns, is the application of a jquery "droppable" to each cell inefficient? Can I assign the droppable to the parent TABLE, for instance, and then somehow capture the actual element (ie. the TD) where the item is dropped? If I remember my event delegation correctly, in an...
So I know that if an element is droppable, then you can set an option like: drop: function(){ alert('something was dropped'); } but how can I set it so I can reference the element dropped onto it, so I could do something like this: drop: function(){ alert(elementId + ' was dropped'); } Thanks. ...