来自https://github.com/RubaXa/Sortable的功能要求

Question

I am using https://github.com/RubaXa/Sortable and i need to write an if/else function that can basically tell if you have dragged the right tile to the right target and if you haven't, bounce it back to where it came from (same order).

Pretty sure i use this event: Element is dropped into the list from another list

 onAdd: function (/**Event*/evt) {
    var itemEl = evt.item;  // dragged HTMLElement
    evt.from;  // previous list
    // + indexes from onEnd
    },

First off, is evt a common parameter? (I am not a coder).

Please find my working code here: https://codepen.io/maevemacn/pen/XMvZjP this does not include the external sortable.min.js file

Any help greatly appreciated Maeve

Answer 1

How about something like this then? This is a minimal implementation of what I believe you're after.

http://codepen.io/anon/pen/xdGoNe

            onMove: function (evt, originalEvent) {
                var textOfItemBeingDragged = evt.dragged.innerText.toLowerCase();
                var destinationIndexOfTarget = evt.related.getAttribute('destination-index');
                var areWeAllowedToDragToHere = allowedMappings[textOfItemBeingDragged] ==
                    destinationIndexOfTarget;
                return areWeAllowedToDragToHere;
            }

onMove does the interesting work - we check whether we're allowed to drop this item into the specific box