Dragula - 在dragula drop事件上传递类

时间:2016-08-25 12:27:22

标签: php html typescript draggable dragula

所以我有一个可拖动到多个列的对象,我需要这样做,以便当它被删除时,该对象中的变量会根据哪个列进行更新,因为另一个对象操纵该变量进行显示。我无法从标签中获取(ondrop)事件,并且dragula事件监听器的值不会传递任何允许我获取对象的信息。反正是否强制事件监听器传递对象而不是html标签?还是有一些方法我不见了?

3 个答案:

答案 0 :(得分:1)

我找到的唯一解决方案(使用不同的拖放模块)是在用户关闭页面或转到其他内容时保存订单。或者由于drop事件是可捕获的,但似乎无法提供类对象,您仍然可以检测何时发生更改并让它更新所有内容,但这不是最好的解决方法,因为它远远不够比更新一个变量更多地对系统资源征税。

答案 1 :(得分:1)

我认为你可以在drop上更新数据。我这样做了:

var drake = dragula({...});

function updateMyObject(elementId, listId) {
  // update the object here, for example:
  if (listId === 'firstList') {
    // use the element id to find the item in your object and update it
    myDataObject.filter(function(x) {
      return x.id === elementId;
    })[0].propertyToUpdate = listId;
  }
}

drake.on('drop', function(el, target, source, sibling) {
  var elementId = el.id;
  updateMyObject(el.id, target.id);
});

这支笔可能有所帮助。我将Dragula与Angular.js混合用于数据建模。该事件需要在drop上更新数据模型。 http://codepen.io/chris22smith/pen/37459a002cbe6b6cd37aa5e927698fba

答案 2 :(得分:0)

将订单#作为元素中的属性传递,以便在drake.on函数中访问它。使用oder#和ID,您应该能够弄清楚如何处理它并在后端进行正确的更新。