Browse Source

Determine the correct target before onFilter

Fix #156 and also returning correct indexes if a drag handle is present (#154).
pull/157/head
Dan Dascalescu 10 years ago
parent
commit
81748a5828
  1. 3
      README.md
  2. 30
      Sortable.js

3
README.md

@ -86,6 +86,7 @@ var sortable = new Sortable(el, {
// same properties as onUpdate
},
// Attempt to drag a filtered element
onFilter: function (/**Event*/evt) {
var itemEl = evt.item; // HTMLElement receiving the `mousedown|tapstart` event.
}
@ -187,7 +188,7 @@ For each element in the set, get the first element that matches the selector by
var editableList = new Sortable(list, {
filter: ".js-remove, .js-edit",
onFilter: function (evt) {
var el = editableList.closest(evt.item); // list item
var el = editableList.closest(evt.target); // list item
if (editableList.closest(evt.item, ".js-remove")) { // Click on remove button
el.parentNode.removeChild(el); // remove sortable item

30
Sortable.js

@ -162,21 +162,28 @@
_onTapStart: function (/**Event|TouchEvent*/evt) {
var touch = evt.touches && evt.touches[0],
target = (touch || evt).target,
originalTarget = target,
options = this.options,
el = this.el,
filter = options.filter;
// get the index of the dragged element within its parent
startIndex = _index(target);
if (evt.type === 'mousedown' && evt.button !== 0 || options.disabled) {
return; // only left button or enabled
}
if (options.handle) {
target = _closest(target, options.handle, el);
}
target = _closest(target, options.draggable, el);
// get the index of the dragged element within its parent
startIndex = _index(target);
// Check filter
if (typeof filter === 'function') {
if (filter.call(this, target, this)) {
_dispatchEvent(el, 'filter', target);
_dispatchEvent(el, 'filter', target, undefined, startIndex);
return; // cancel dnd
}
}
@ -186,17 +193,11 @@
});
if (filter.length) {
_dispatchEvent(el, 'filter', target);
_dispatchEvent(originalTarget, 'filter', target, undefined, startIndex);
return; // cancel dnd
}
}
if (options.handle) {
target = _closest(target, options.handle, el);
}
target = _closest(target, options.draggable, el);
// IE 9 Support
if (target && evt.type == 'selectstart') {
if (target.tagName != 'A' && target.tagName != 'IMG') {
@ -695,7 +696,7 @@
}
function _globalDragOver(evt) {
function _globalDragOver(/**Event*/evt) {
evt.dataTransfer.dropEffect = 'move';
evt.preventDefault();
}
@ -804,11 +805,12 @@
/**
* Returns the index of an element within its parent
* @param el
* @returns {HTMLElement}
* @returns {number}
* @private
*/
function _index(/**HTMLElement*/el) {
var index = 0;
while ((el = el.previousElementSibling)) {
while (el && (el = el.previousElementSibling)) {
index++;
}
return index;

Loading…
Cancel
Save