Meteor and jQuery ConnectedSortable Lists: "Failed to execute" insertBefore "on" Node "

Using Meteor 1.0, the two lists - connected via jQuery Sortable - work fine when dragging items into different lists.

Except for dragging the last item from the list and dropping it to the first or middle position in the new list:

"Exception in queued task: Error: Could not execute 'insertBefore' on 'Node': the node before which the new node is to be inserted is not the child of this node."

Discarded as "last".

I understand that Meteor Blaze is contrary to jQuery, but any hints are greatly appreciated. Error message in console:

enter image description here

Full trace:

 at Error (native)
 at DOMRange.attach (http://localhost:3000/packages/blaze.js?77…)
 at DOMRange.setMembers (http://localhost:3000/packages/blaze.js?77…)
 at DOMRange.removeMember (http://localhost:3000/packages/blaze.js?77…)
 at http://localhost:3000/packages/blaze.js?77…
 at Object.Tracker.nonreactive (http://localhost:3000/packages/tracker.js?19…)
 at Object.eachView.stopHandle.ObserveSequence.observe.removedAt (http://localhost:3000/packages/blaze.js?77…)
 at Object.cursor.observe.removedAt (http://localhost:3000/packages/observe-sequence.js?2f…)
 at observeChangesCallbacks.removed (http://localhost:3000/packages/minimongo.js?9a…)
 at Object.self.applyChange.removed (http://localhost:3000/packages/minimongo.js?9a…)

      

Code:

list_items.jade

ul.tasks.sortable
   each tasks
     |{{ >taskItem }}
   else
     |There are no tasks yet.

      

task_item.jade

template(name="taskItem")
  li.task.item
    .inner
      .title
        |{{ title }}
      .date.light-text on {{ created }}
      strong list: {{ listId }}
      small rank: {{ rank }}

      

list_item.coffee

Template.listItem.helpers
  'tasks': ->
    currentUserId = Meteor.userId()
    Tasks.find
      userId: currentUserId
      listId: this._id
    ,
      sort:
        rank: 1

Template.listItem.rendered = ->
  @$(".tasks.sortable").sortable
    placeholder: "task-placeholder"
    connectWith: ".tasks.sortable"
    tolerance: "pointer"

    start: (e, ui) ->
      item = ui.item
      parent = ui.item.parent().get(0)
      listId = Blaze.getData(parent)._id
      newList = oldList = listId
      return

    stop: (e, ui) ->
      el = ui.item.get(0)
      parent = ui.item.parent().get(0)
      listId = Blaze.getData(parent)._id

    # Dragged within same list
    if listId == oldList
      console.log "same"
      before = ui.item.prev().get(0)
      after = ui.item.next().get(0)
      if before    
        if after
          newRank = (Blaze.getData(after).rank + Blaze.getData(before).rank) / 2
        else
          newRank = Blaze.getData(before).rank + 1
      else if after
        newRank = Blaze.getData(after).rank - 1

    # Dragged to new list
    else
      console.log "*NEW*"
      if Tasks.find({listId: listId}).count() == 0
        newRank = 1
      else
        before = ui.item.prev().get(0)
        after = ui.item.next().get(0)
      if before    
        if after
          newRank = (Blaze.getData(after).rank + Blaze.getData(before).rank) / 2
        else
          newRank = Blaze.getData(before).rank + 1
      else if after
        newRank = Blaze.getData(after).rank - 1


    console.log "Moved " + Blaze.getData(el)._id + " from " + oldList + " to " + listId

    #update the dragged Item rank
    Tasks.update
      _id: Blaze.getData(el)._id
    ,
      $set:
        listId: listId
        rank: newRank

      

+3


source to share





All Articles