Jqueryでアクションを繰り返すうちにHTMLコードを追加できない

Question

HTMLコード（ajaxで呼び出されている）を要素を削除するセクションに追加しようとしていますが、その間に最初に追加できます同じドロップイベントを繰り返している間にHTMLコードを追加できません。また、両方の要素をソート可能にして、最後にソート可能な関数を呼び出しています。

私はhttp://jsfiddle.net/UD_B/Geupm/1/

に、次のショッピングカートチュートリアル利用可能なリンクをたどっここに私のjQueryのコードは次のとおりです。

nitsbuilder.init = function() { 
    var navmenu= $('ul.nitseditormenu').find('li').find('ul').find('li'); 
    navmenu.draggable({ 
     connectToSortable: "nitsbuilder.editarea", 
     helper: "clone", 
     cursor: "move",    
    }); 

    nitsbuilder.editarea.droppable({ 
     drop: function (event, ui) { 
       nitsbuilder.dropeventhandler(ui.draggable, ui.offset); 
     } 
    }).sortable({ 
     revert: true 
    }); 
}(); 

nitsbuilder.dropeventhandler = function ($item, $position) { 
    var nits_id = $item.data('nitsid'); 
    var i = 0; 
    $.ajax({ 
     method: 'POST', 
     url: dropurl, 
     data: { nits_id: nits_id, _token: token}, 
     dataType: 'json', 
     success: function (data) { 
      if (nitsbuilder.editarea.find('[data-nitsid]').length > 0) { 
       nitsbuilder.editarea.children('[data-nitsid]').each(function() { 
        if ($(this).offset().top >= $position.top) { 
         $(data.htmlcode).insertBefore($(this)); 
         i = 1; 
         return false; 
        } 
       }) 
      } 
      if (i != 1) { 
       nitsbuilder.editarea.html(data.htmlcode); 
       var datanits = nitsbuilder.editarea.find('[data-nitsid]').length; 
       console.log(datanits); 
      } 
     } 
    }); 
} 

（JSFiddle）

として、質問のための最小限のコードを見つけてください、私を助けてくださいでる。おかげさまで

Answer 1

アクションを実行した後は、ドラッグアンドバインドを解除する必要があります。要素を作成する。私はクラスセレクタを使うことを勧めます。

1removingのfuncionality

$（ ".selector"）.draggable（ "破壊"）;

2再び

$（ "セレクタ"）ドラッグ可能な（..あなたが欲しいものを...）を追加します。;