nestedsortable动态项目不崩溃

我使用这个嵌套的可排序插件mjsarfatti.com/sandbox/nestedSortable和我迄今唯一的问题是当我动态地添加一个项目到“树”，我无法展开或折叠项目（S）。到目前为止，我只是使用示例代码，并添加了该代码。nestedsortable动态项目不崩溃

如何我加入项目动态：

$('#new-button').on('click', function() {  
    var nextId = $('ol.sortable').nestedSortable('nextId'); 
    var $li = $("<li id=\"list_" + nextId + "\"><div><span class=\"disclose\"><span></span>   
    </span>New Item</div>"); 
    $li.addClass('mjs-nestedSortable-leaf');   
    $('ol.sortable').append($li);    
})

当我添加这些新项目的树，他们的工作就好了 - 我可以在整个树动他们，让他们的孩子，等等。然而，当我尝试折叠一个我曾做过父母的新项目时 - 没有任何回应。

我相信我只是没有在某处添加正确的事件处理程序，但我不能确定发生了什么。添加新项目后，我甚至触发了树的destroy（）和_create（），希望能够再次“重新配置”所有项目。但是，那里没有运气。任何人都可以告诉我如何正确连接这些新的动态创建的项目，这样他们将被视为树中的其他项目？

谢谢！

来源

2013-07-17 bthews

我一直推荐的一件事是设置一个http://jsfiddle.net，如果可能的话，显示你的错误，以帮助其他人更容易帮助你调试你的情况。 – Banning

是的，我想过，而且我应该做到这一点。然而，在这一点上，我真的解决了我的问题。我会尽我所能发布我的解决方案（显然我不能8小时） – bthews

好吧，看了这两天后，我才解决了这个问题。很有趣 - 我一直在寻找的代码就在我刚才输入的新代码的正上方。（就在我的鼻子下方。）感谢这里的善良人士向我介绍：Visual Event - 这大大帮助我追踪事件的创建地点。

$('#new-button').on('click', function() {  
    var nextId = $('ol.sortable').nestedSortable('nextId'); 
    //Begin creating dynamic list item 
    var $li = $("<li id=\"list_" + nextId + "\">"); 
    var $lidiv = $("<div></div>"); 
    var $disli = $("<span class=\"disclose\"><span></span></span>"); 
    $li.addClass('mjs-nestedSortable-leaf'); 

    //Assign event listener to newly created disclose span tag above 
    $disli.on('click', function() { 
     $(this).closest('li').toggleClass('mjs-nestedSortable-collapsed').toggleClass('mjs-nestedSortable-expanded'); 
    }); 

    //Now actually start to append to DOM 
    $lidiv.append($disli); 
    $lidiv.append("New List Item " + nextId); 
    $li.append($lidiv); 
    $('ol.sortable').append($li);   
})

希望这可以帮助别人。这是一个working copy如果你想看到它的行动。

来源

2013-07-18 12:28:10 bthews

nestedsortable动态项目不崩溃

回答

相关问题