Javascript Jquery.UI.Sortable this.placeholder[0]。parentNode为空
我用Sortable连接了两个列表。我有一个包含可用项目的列表,可以移动到包含有序项目列表的真实列表。我的目标是从一个列表中取出一个项目,并将其移动到第二个列表中。当在新列表中放置到位时,更新事件将触发对数据库的json更新 当您删除项目时会出现问题,然后:Javascript Jquery.UI.Sortable this.placeholder[0]。parentNode为空,javascript,jquery,jquery-ui,Javascript,Jquery,Jquery Ui,我用Sortable连接了两个列表。我有一个包含可用项目的列表,可以移动到包含有序项目列表的真实列表。我的目标是从一个列表中取出一个项目,并将其移动到第二个列表中。当在新列表中放置到位时,更新事件将触发对数据库的json更新 当您删除项目时会出现问题,然后: $(“#sortable2”).sortable({items:'li'})。sortable('toArray')触发。然后我得到错误:“this.placeholder.0”为空或不是对象消息 现在在接收列表中,我仍然可以移动项目以使用
$(“#sortable2”).sortable({items:'li'})。sortable('toArray')
触发。然后我得到错误:“this.placeholder.0”为空或不是对象消息
现在在接收列表中,我仍然可以移动项目以使用它们,并且当更新事件触发时,只要我没有将新项目放入列表中,一切都正常
我已找到并尝试从指示替换的位置应用错误修复:
this.placeholder[0].parentNode.removeChild(this.placeholder[0]);
与
其他详细信息:当我返回一个json错误并尝试$(“#sortable2”).sortable('cancel')时,我更进一步地发现错误是由错误引起的代码>我想现在我需要了解当我将数据从另一个列表移动到列表中时如何执行取消
这一修正方案不起作用。
有人知道如何解决这个问题吗
如果出现某种错误,有人知道如何使用“取消”将2个列表还原为原始列表吗?取消就是抛出错误的原因
我的代码:
$(function() {
$("#sortable2").sortable({
connectWith: '.connectedSortable'
,
placeholder: 'ui-state-highlight'
,
items: 'li:not(.ui-state-disabled)'
,
receive: function(event, ui) {
},
remove: function(event, ui) {
},
update: function() {
$("#sortable2").sortable("refreshPositions");
//updateCycleSort();
}
})
$("#sortable1").sortable({
connectWith: '.connectedSortable'
,
placeholder: 'ui-state-highlight'
})
$("#sortable1 li, #sortable2 li").disableSelection();
});
function updateCycleSort() {
alert($("#sortable2").sortable({items: 'li'}).sortable('toArray'));
$.ajax({
type: "POST",
url: updateCycleSortUrl,
data: "cycles=" + $("#sortable2").sortable({items: 'li'}).sortable('toArray'),
dataType: "json",
success: function(response, textStatus, XMLHttpRequest) {
if (response.error == "false") {
//$('div#resultRecordDetail').html(response.message);
//$('div#resultRecordDetail').addClass('success');
//autoHide(2500);
}
else {
$("#sortable2").sortable('cancel');
alert("error");
}
},
error: function(response, textStatus, AjaxException) {
alert("BIG error " + response.statusText);
//$('div.dialog-result').html(response.statusText);
//$('div.dialog-result').addClass('error').show();
//autoHide(10000);
}
});
return false;
}
返回stop()后不能取消。你必须实现你自己的
还有一些bug需要解决,比如我遇到了一个类似的问题,我发现start事件有足够的信息来确定项目的来源(beforeStop可能也有这个,但我现在不记得我是否尝试过,或者我发现了什么)。所以我只记得原始位置,直到JSON调用返回,并将其放回失败状态。当我将可拖放连接到可排序表时,我收到了此错误消息。这个错误是因为当一个元素被删除时,我会隐藏这个可删除项所属的面板。确保您的可拖放/可排序的原始容器在完成任何回调之前未被更改似乎是必要的。。这有什么办法吗?我需要把面板藏起来,但绕不过去。。。
$(function() {
$("#sortable2").sortable({
connectWith: '.connectedSortable'
,
placeholder: 'ui-state-highlight'
,
items: 'li:not(.ui-state-disabled)'
,
receive: function(event, ui) {
},
remove: function(event, ui) {
},
update: function() {
$("#sortable2").sortable("refreshPositions");
//updateCycleSort();
}
})
$("#sortable1").sortable({
connectWith: '.connectedSortable'
,
placeholder: 'ui-state-highlight'
})
$("#sortable1 li, #sortable2 li").disableSelection();
});
function updateCycleSort() {
alert($("#sortable2").sortable({items: 'li'}).sortable('toArray'));
$.ajax({
type: "POST",
url: updateCycleSortUrl,
data: "cycles=" + $("#sortable2").sortable({items: 'li'}).sortable('toArray'),
dataType: "json",
success: function(response, textStatus, XMLHttpRequest) {
if (response.error == "false") {
//$('div#resultRecordDetail').html(response.message);
//$('div#resultRecordDetail').addClass('success');
//autoHide(2500);
}
else {
$("#sortable2").sortable('cancel');
alert("error");
}
},
error: function(response, textStatus, AjaxException) {
alert("BIG error " + response.statusText);
//$('div.dialog-result').html(response.statusText);
//$('div.dialog-result').addClass('error').show();
//autoHide(10000);
}
});
return false;
}