var menu = $("ol.menu").nestedSortable({
handle: '.move',
items: 'li',
placeholder: 'placeholder',
opacity: 0.7,
toleranceElement: '> i',
connectWith: 'ol',
isTree: true,
}).disableSelection();
$('#addMenu').on('click',function(){
var text = $('#menuText').val();
var link = encodeURIComponent($('#menuLink').val());
if(text != '' && link !=''){
var html = $('<li id="menu_'+(parseInt(menu.children.length)+2)+'" class="mjs-nestedSortable-leaf">')
.append($('<i class="glyphicon glyphicon-move">'),
' '+text+' - '+link,
$('<span class="remove-btn removeMenu">')
.append('<i class="glyphicon glyphicon-minus">'),
$('<ol>')
);
menu.append($(html));
menu.nestedSortable('refresh');
console.log(menu.nestedSortable('toArray'));
$('#menuText').val('');$('#menuLink').val('');
}else{
alert('Menü Başlığı ve link boş bırakılamaz!');
}
});
无论我能找到什么,我已经红了。但一切都没有改变。我正在向列表添加新项目,但我无法将其移动到可排序容器中。页面加载带来的元素很好,它们是可移动的。如何实现它。
我红了 - &gt; nestedsortable dynamic item not collapsing
我无法使func“nextId”工作....
我很想念。
Thansk
答案 0 :(得分:1)
我瘦了这是你的问题: document.ready中的所有代码都在页面加载时工作。但当你追加某些东西时,它就不起作用了!最简单的方法是:
你应该在你的代码中添加这样的东西:
<div id="addmenu" onclick="yourfunction()" > </div>
js:
function yourfunction(){
var text = $('#menuText').val();
var link = encodeURIComponent($('#menuLink').val());
if(text != '' && link !=''){
var html = $('<li id="menu_'+(parseInt(menu.children.length)+2)+'" class="mjs-nestedSortable-leaf">')
.append($('<i class="glyphicon glyphicon-move">'),
' '+text+' - '+link,
$('<span class="remove-btn removeMenu">')
.append('<i class="glyphicon glyphicon-minus">'),
$('<ol>')
);
menu.append($(html));
menu.nestedSortable('refresh');
console.log(menu.nestedSortable('toArray'));
$('#menuText').val('');$('#menuLink').val('');
}else{
alert('Menü Başlığı ve link boş bırakılamaz!');
} }
答案 1 :(得分:0)
我真傻。我刚刚忘记了班级名称&#34;移动&#34; for dynamic in dynamic var html :( ..我现在解决了。