Tags
jQuery
Asked 7 years ago
9 Aug 2016
Views 725
jagdish

jagdish posted

Why Jquery ui sortable dont have revert functionality ?

i want to revert Jquery ui sortable object . or other word we can say i want to make it clone when it dragged to connected with element.

steave ray

steave ray
answered May 1 '23 00:00

JQuery UI Sortable does not have a built-in revert functionality because the purpose of Sortable is to provide drag-and-drop sorting functionality for a list of items, rather than creating an undo mechanism for dragging and dropping items.

However, you can simulate a revert functionality by using a combination of Sortable events and some additional JavaScript code. Here is an example of how you could implement a "revert" effect when a user drags an item but does not drop it:


$( "#sortable" ).sortable({
  start: function(event, ui) {
    // save the original position of the item
    ui.item.data('original-index', ui.item.index());
  },
  stop: function(event, ui) {
    var originalIndex = ui.item.data('original-index');
    var currentIndex = ui.item.index();
    if (originalIndex != currentIndex) {
      // item was dropped in a new position, no need to revert
      return;
    }
    // item was not dropped, animate a revert effect
    ui.item.animate({ top: 0, left: 0 }, 'slow');
  }
});

In this example, we u se the start event to save the original index of the item, and the stop event to check if the item was dropped in a new position or not . If the item was dropped in a new position, we do nothing. If the item was not dropped, we animate a "revert" effect by animating the item back to its original position.
Post Answer