jquery-ui-sortable

问题 I have the following table code: <tbody> <tr data-id='1' id='item-1'> <td>30-01-2014</td> </tr> <tr data-id='19' id='item-2'> <td>30-01-2014</td> </tr> <tr data-id='5' id='item-3'> <td>30-01-2014</td> </tr> <tr data-id='39' id='item-4'> <td>30-01-2014</td> </tr> </tbody> and the jQuery: $('table tbody').sortable({ axis: 'y', update: function (event, ui) { var data = $(this).sortable('serialize'); $.ajax({ data: data, type: 'POST', url: 'updatePagesOrder.php' }); } }); var i = 1; $('table >

问题 I am using the jQuery Sortable plugin. Looking at the basic example on how to serialize the data I have the below code. <div class='span4'> <ol class='serialization vertical'> <li data-id='1' data-name='Item 1' data-status='1'>Item 1 <span class="status">toggle</span></li> <li data-id='2' data-name='Item 2' data-status='1'>Item 2 <span class="status">toggle</span></li> <li data-id='3' data-name='Item 3' data-status='1'>Item 3 <span class="status">toggle</span></li> <li data-id='4' data-name=

问题 I am working with an jQueryUI sortable list , and want to animate the transitions when li s are moved around as I drag an element up or down. As Apple have done it in their iPod app when rearranging a playlist's songs. Is this possible? I've searched for hours, but cannot find anything useful. 回答1: I've put the code that user1754406 found on github into jsfiddle, it was just what I was looking for: http://jsfiddle.net/samjones00/AbpJF/ Too much code to paste, please see the code on jsfiddle

问题 I need to sort some elements depend on it attribute. For an example: <div id="sort"> <div n="1"></div> <div n="2"></div> <div n="3"></div> <div n="4"></div> </div> And array_num {3, 2, 1, 4} pseudo code: $('#sort').sort(array_num, 'n'); results will be: <div id="sort"> <div n="3"></div> <div n="2"></div> <div n="1"></div> <div n="4"></div> </div> 回答1: ​var order = [3, 2, 4, 1]​; var el = $('#sort'); var map = {}; $('#sort div').each(function() { var el = $(this); map[el.attr('n')] = el; });

问题 I need to sort some elements depend on it attribute. For an example: <div id="sort"> <div n="1"></div> <div n="2"></div> <div n="3"></div> <div n="4"></div> </div> And array_num {3, 2, 1, 4} pseudo code: $('#sort').sort(array_num, 'n'); results will be: <div id="sort"> <div n="3"></div> <div n="2"></div> <div n="1"></div> <div n="4"></div> </div> 回答1: ​var order = [3, 2, 4, 1]​; var el = $('#sort'); var map = {}; $('#sort div').each(function() { var el = $(this); map[el.attr('n')] = el; });

问题 I am working with the jQuery UI Sortable plugin and everything works as expected accept for one issue. After I am done dragging an item to reorder the list (a list of <A> tags) the click event fires after the drop is done. Anyone run into this issue before? If so, how did you go about fixing it? 回答1: Ok... I figured it out.. Here is my solution: $(thumbOpts.container).sortable({ items: '.page', revert: true, opacity: 0.5, start: function(evt, ui) { var link = ui.item.find('a'); link.data(

问题 I have table rows that are sortable depending on whether certain radio buttons are checked or not. The sortables are initialized on document.ready as follows: $(document).ready(function() { // Return a helper with preserved width of cells // handy code I got from http://lanitdev.wordpress.com/2009/07/23/make-table-rows-sortable-using-jquery-ui-sortable/ var fixHelper = function(e, ui) { ui.children().each(function() { $(this).width($(this).width()); }); return ui; }; // #opts = table id; tr

问题 I have 2 connected sortable lists. One is inside an accordion. When I try to drag items from the sortable in the accordion, the helper disappears as soon as I get outside of the accordion. I can drop to one of the other connected sortables and the item will display, but it just doesn't display while I'm dragging. The accordion also scrolls down if I drag and item down. I can drag & drop items from either of the other list wherever I need and it works fine. How can I make items not disappear

问题 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

问题 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