添加的jQuery的DragDrop淘汰赛

可能重复：
Sortable and droppable knockout list 添加的jQuery的DragDrop淘汰赛

我使用淘汰赛绑定一个UL。我想让用户能够拖放一个LI和我的viewmodel以重新排序更新。

拖放工作，我有正确的事件在我的jQuery中工作，但我不知道如何进行更新。

我曾围绕文档寻找，但找不到任何东西。

我创建了一个小提琴做出解释我在做什么更容易一些

Js Fiddle here

任何建议将是真棒！

更新了的jsfiddle链接

来源

2012-08-10 Diver Dan

某事在tha t小提琴应该是可拖动的？ – JMM 2012-08-11 01:27:55

嘿@JMM是你的权利。我修复了链接 – 2012-08-11 08:40:11

只是FYI ...你可以像这样重写toJSON（关于Knockout 2.1的新功能）self.lastSavedJson（ko.toJSON（self.questions，null，2））; – 2012-08-11 14:47:40

我从来没有与淘汰赛工作，我没有时间去了解它的复杂性，现在，所以这不是一个完整的解决方案，但here's something to get you started。请参阅下面的链接，了解我在搜索时发现的某些页面可能会帮助您完成解决方案。

这是我从你original fiddle改变的部分：

var view_model = new ViewModel(initialData); 

ko.applyBindings(view_model); 

$(function() { 
    $("#sortable").sortable({ 
     revert: true, 
     stop: function(event, ui) { console.log("stop event")}, 


     start : function (event, ui) { 

      ui.item.data('previous_index', ui.item.index()); 

     }, 
     // start 


     update : function (event, ui) { 

      var question = view_model.questions.splice(

       ui.item.data('previous_index'), 1 

      )[0]; 

      view_model.questions.splice(ui.item.index(), 0, question); 

      ui.item.removeData('previous_index'); 

     } 
     // update 

    }); 
});

参考文献：

jQuery UI Sortable, how to determine current location and new location in update event?

get the start position of an item using the jquery ui sortable plugin

jQuery Sortable() with original position placeholder?

knockout + jqueryui draggable/droppable follow-up

来源

2012-08-11 13:50:43 JMM