ドラッグアンドドロッブの位置を復元する

Question

私は自分のコード内でドラッグ＆ドロップjquery UIを使用します。コードは正常に動作します。しかし、ユーザーは保存後にデータを編集する能力が必要です。つまり、ユーザーがページを再び開くと、ドラッグアンドドロップの位置を復元する必要があります。私はトリガーを使用しようとするが、私は "ドロップUI"をエミュレートすることはできませんどのように私はそれを行うことができますか？

$(".draggable-children-username").draggable({ 
    snap: ".draggable-in-box", 
    opacity: 0.7, 
    revert: 'invalid', 
    helper: "clone" 
}); 
$(".draggable-in-box").droppable({ 
    accept: $(".draggable-children-username"), 
    hoverClass: "dropHover", 
    drop: function (ev, ui) { 
     $(this).trigger("DopeEvent", ui); 
    } 
}); 

$(".draggable-in-box").bind("DopeEvent", function(event, ui){ 
    console.log(ui); 

    var me = ui.draggable.clone() 
    ui.draggable.draggable("disable") 
    me.appendTo(this) 
    .addClass("newClass"); 
    me.draggable({ 
     accept: ".draggable-in-box", 
     revert: function(valid) { 
      if(!valid) { 
       this.remove(); 
       $(".dr-children-id-"+this.attr("data-id")).draggable("enable"); 
      } 
     } 
    }); 
}); 

$(".draggable-in-box").trigger("DopeEvent", $(".dr-children-id-140")); 

現在のエラー：キャッチされない例外TypeError：ui.draggable.cloneは

http://jsfiddle.net/vjGY4/123/

Answer 1

いくつかの修正機能ではありません。私はあなたがしようとしている何を考えての作業例：あなたがドラッグ可能なオブジェクトまたはjQueryオブジェクトを渡されている

http://jsfiddle.net/Twisty/vjGY4/125/

jQueryの

$(".draggable-children-username").draggable({ 
    snap: ".draggable-in-box", 
    opacity: 0.7, 
    revert: 'invalid', 
    helper: "clone" 
}); 

$(".draggable-in-box").droppable({ 
    accept: $(".draggable-children-username"), 
    hoverClass: "dropHover", 
    drop: function(ev, ui) { 
    $(this).trigger("DopeEvent", ui.draggable); 
    } 
}); 

$(".draggable-in-box").bind("DopeEvent", function(event, ui) { 
    console.log(ui); 

    var me = $(ui).clone(); 
    //ui.draggable.draggable("disable") 
    me.appendTo(this) 
    .addClass("newClass"); 
    me.draggable({ 
    accept: ".draggable-in-box", 
    revert: function(valid) { 
     if (!valid) { 
     this.remove(); 
     $(".dr-children-id-" + this.attr("data-id")).draggable("enable"); 
     } 
    } 
    }); 
}); 

$(".draggable-in-box").trigger("DopeEvent", $(".dr-children-id-140")); 

1. を負いません。あなたDopeEvent。あなたのdropで
2. var me = $(ui).clone();を使用して、あなたはそうのような要素を渡す必要があります役立ちます$(this).trigger("DopeEvent", ui.draggable);

希望。あなたは何が渡されているかをチェックすることでイベントを改善することができます。 if(typeof ui === "object"){}のようなものが動作する可能性があります。