Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cancel dragging of a sortable item

Tags:

An absolutely common sortable case:

<script> $(function() {   $("#sortable").sortable(); }); </script>  <ul id="sortable">   <li>Item 1</li>   <li>Item 2</li>   <li>Item 3</li> </ul> 

Problem. Need to cancel dragging of an item on some condition and there is a good advice of Andrew Whitaker, but that approach is working only for jquery-ui-draggable and fails for sortables:

$("#sortable").sortable({   start: function() {     return false; // will still cause `this.helper is null`   } }); 

Will be greateful for suggestions.

like image 857
mcmlxxxiii Avatar asked Feb 27 '11 12:02

mcmlxxxiii


2 Answers

Sortable has a "cancel" capability invoked using sortable('cancel').

From the docs: "Cancels a change in the current sortable and reverts it to the state prior to when the current sort was started." See http://api.jqueryui.com/sortable/#method-cancel.

Example usage:

$("#sortable").sortable({   stop: function(e, ui) {     if ("I need to cancel this") {       $(ui.sender).sortable('cancel');     }   } }); 
like image 53
root Avatar answered Nov 29 '22 09:11

root


Returning false as fudgey suggests works great for making things dynamically unsortable, but there's also a cancel option in the sortable config which lets you set up static unsortables as well:

$("#sortable").sortable({     // this prevents all buttons, form fields, and elemens     // with the "unsortable" class from being dragged     cancel: ":input, button, .unsortable" }); 
like image 25
Ben Blank Avatar answered Nov 29 '22 11:11

Ben Blank