javascriptknockout.jsknockout-sortable

knockout-sortable 'dragged' callback not working

I am trying to adapt the example fiddle from the knockout-sortable in order to use the 'dragged' callback instead of the default 'clone' function.

http://jsfiddle.net/mp2k170t/1/

I've added a 'makeNewTask' method to the root viewmodel like this:

self.makeNewTask = function(task, event, ui) {
    alert('make new task');
    return new Task(task.name() + " (created by makeNewTask)");
}

I am trying to bind to it by using this:

<div class="item" data-bind="draggable: { data: newTask, isEnabled: allowNewTask, dragged: $root.makeNewTask }">

However, the clone method is still being called. What am I doing wrong?

Solution

  • dragged callback is only available in sortable binding.

    If you change sortable binding as

    <div class="container" data-bind="sortable: {data: tasks, dragged: $root.makeNewTask}">

    and draggable binding as 

    <div class="item" data-bind="draggable: { data: newTask, isEnabled: allowNewTask  }">

    should work. Use dragged as an alternative to clone. So you might consider removing the clone method from prototype if using dragged option.

    Fiddle