jquery-ui-sortable

问题 How to listen to drag event when a jquery-ui-sortable is being dragged? By hit-n-trial strategy, I've tried drag event from jquery-ui-draggable but it's not working. $('.widget_container').sortable({ drag: function(event, ui) { console.log('drag'); } }); 回答1: Use sort event for this purpose: $(".sortable").sortable({ sort: function(e) { console.log('X:' + e.screenX, 'Y:' + e.screenY); } }); http://jsbin.com/kegeb 回答2: If you need to handle the event when the user starts to drag, you should

问题 I want to have a list that is sortable, but I also want the elements in that list to be droppable to the divs I have defined as droppable. I can't seem to find a way to do it. Any ideas? 回答1: Here's a simplified version of Colin's solution. The biggest difference is that this solution does not store the entire html of the sortable elements, but only the currently dragged item. It is then inserted into it's original position if the item is dropped on the droppable area. Anyway, here's the code

问题 I want to have a list that is sortable, but I also want the elements in that list to be droppable to the divs I have defined as droppable. I can't seem to find a way to do it. Any ideas? 回答1: Here's a simplified version of Colin's solution. The biggest difference is that this solution does not store the entire html of the sortable elements, but only the currently dragged item. It is then inserted into it's original position if the item is dropped on the droppable area. Anyway, here's the code

问题 I am cloning elements as they are dragged out of a JQuery UI Draggable list using JQuery's clone() method. Looking at the clone() documentation, I see that I can clone events already bound to these elements by passing one or two Boolean arguments (true,true) to the clone() method. It's with passing these arguments that things get weird. If I just use clone() as shown below, things work as expected. $(".draggable").draggable({ connectToSortable: ".sortable", helper: function(e) { return $(this

问题 I use: http://johnny.github.io/jquery-sortable/ With this plugin you can change the order of a list or the order of table rows (thats my case). For example with the mouse you drag the fourth row to the second position. Width the plugin method sort.sortable("serialize") you have access to the new order. But how to use sort.sortable("serialize") ? You find an example here: http://johnny.github.io/jquery-sortable/#table I would like to send the new order of my table rows to myurl.php. How to use

问题 I've got a scenario where I have multiple droppable containers, that are also sortable . I need to be able to drag clone s from my source draggable , and drop them on any of the droppables . Within each droppable , the items need to be sortable . I also need to be able to drag a draggable from one droppable to another. Here is a JSFiddle I've started as a proof of concept that I can't quite get working. There are two issues I can see: If you drag two items onto the first (left-most) droppable

问题 UPDATE: I have changed the jsfiddle. I am sure the element has to be loaded the javascript/jquery to get the jquery behavior(s). The bottom of the javascript widow holds existing_js var which I think should be used to insert the element. It is appended to the proper area (#drop-area) but it is still not sortable or able to have "fields" dropped into it. The jsfiddle link has been changed to this new version. I have a drag and drop serialized list. I am dragging and dropping it into my

问题 UPDATE: I have changed the jsfiddle. I am sure the element has to be loaded the javascript/jquery to get the jquery behavior(s). The bottom of the javascript widow holds existing_js var which I think should be used to insert the element. It is appended to the proper area (#drop-area) but it is still not sortable or able to have "fields" dropped into it. The jsfiddle link has been changed to this new version. I have a drag and drop serialized list. I am dragging and dropping it into my

问题 This is my code for jquery sortable. I want to remove duplicates from sortable2 and sortable3 after dragging the element within it. I tried so many ways but I failed. Please give me a full working code so that I can implement it on my script. <html lang="en"> <head> <meta charset="utf-8" /> <title>jQuery UI Sortable - Connect lists</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery-1.9.1.js"><

问题 This is my code for jquery sortable. I want to remove duplicates from sortable2 and sortable3 after dragging the element within it. I tried so many ways but I failed. Please give me a full working code so that I can implement it on my script. <html lang="en"> <head> <meta charset="utf-8" /> <title>jQuery UI Sortable - Connect lists</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery-1.9.1.js"><