Идея довольно проста и почти работает. Существует две таблицы, и пользователь имеет возможность перетаскивать строки между двумя таблицами. Когда строка перетаскивается из таблицы 1 в таблицу2, ajax используется для обновления базы данных данными, которые удаляются из таблицы 1, добавляется в таблицу2 и повторно отображает обе таблицы с новыми данными. То же самое работает, если информация перетаскивается из таблицы2 в таблицу1.Перетаскивание строк между столами
Вы можете увидеть образец кода here.
Вот отрывок кода Javascript для одной из таблиц:
var startTable = "table1";
var $tabs=$("#" + startTable);
$("tbody.connectedSortable")
.sortable({
connectWith: ".connectedSortable",
items: "> tr:not(:first)",
appendTo: $tabs,
helper:"clone",
cursor:"move",
zIndex: 999990
})
.disableSelection()
;
$($tabs).droppable({
accept: ".connectedSortable tr",
hoverClass: "ui-state-hover",
drop:function(event, ui){
var start= ui.draggable.attr("id");
var desTable = $(this).attr("id");
if(start != desTable){
alert("The ajax should be called");
}
return false;
}
});
Он отлично работает только для одного случая, за исключением. Если строка перетаскивается из Таблицы 1 в Таблицу 2, она создает слот, чтобы показать, где строка будет вставлена при отпускании строки. Другими словами, если пользователь перетаскивает строку из Таблицы 1 в последний элемент таблицы 2, она создает открытое место-держатель (под последней строкой в таблице 2), чтобы отображать, куда будет идти строка при отпускании. Есть одна проблема с этим. Если создатель места создан, но строка затем перетаскивается за пределы таблицы и отпускается, строка по-прежнему переходит к владельцу места, но свойство перетаскивания никогда не вызывается.
Что бы я хотел, чтобы произошло, если создается место-владелец, независимо от того, где строка отпускается, он перейдет к держателю места и вызовет код с возможностью замены, который соответствует таблице, в которую она была сброшена Если ни один владелец места не присутствует, строка должна вернуться туда, куда она была перетащена, и ничего не должно произойти.
Каждый пример, который я пробовал, который перетаскивает строки между двумя таблицами, имеет ту же проблему. Вы, ребята, имеете какой-либо способ вызвать droppable code, даже если строка выпадает за пределами таблицы? Или, может быть, есть лучший способ вызвать ajax, а не когда строка выпадает на стол? Любое понимание было бы весьма благодарным.
вы можете использовать событие update в sortable вместо события drop. –
Было бы замечательно, если бы все было так просто. Я буду работать над ним примерно через час и затем опубликую результаты. Благодарю. – Brian
Событие обновления похоже на то, что я ищу. Я изменил свой код, чтобы использовать обновление, но я столкнулся с ошибкой.Обновление из таблицы 1 никогда не вызывается, вызывается только обновление из таблицы2. Кроме того, если я перетаскиваю из таблицы1 в таблицу2, обновление table2 вызывается дважды. Вот скрипка: http://jsfiddle.net/bhealy/t011juda/28/ Любая идея, что происходит? – Brian