Response title
This is preview!
clone nested sortable ul issue
in Using jQuery UI
•
10 years ago
I have sortable lists on my page. I create a clone LI element. The <li> contains a nested UL also decorated with "sortable" class. The nested UL within the cloned <li> is not sortable. The nested <ul> with the <li> template is sortable. Any information on how to resolve this issue is appreciated.
js
- //sort setup
- function configureSort(){
$(".sortable").sortable({
placeholder: "placeholder",
cancel: "#listHeader",
helper: 'clone'
}).sortable("option", "connectWith", "ul.sortable");
}
function clone(){
//select
var $template = $("#linkTemplate");
//clone and locate
var $clone = $template.clone(true);
//insert
$staging = $("#ulContainer");
$staging.show().append($clone);
}
html
- <!-- Staging List -->
<div>
<ul id="ulContainer" class="menuList sortable hide"></ul>
</div>
<!-- Custom Link Template -->
<ul class="hide sortable">
<li id="linkTemplate">
<div class="wrapper">
<a target="_blank" href="#" >
<span>My Template</span>
</a>
<div class="control hide">
<a >Remove</a>
<a >Display All</a>
</div>
<ul class="sortable"></ul>
</div>
</li>
</ul
1