我有两个列表
<ul class="sortable" id="list-A">
<li id="1">Value 1 </li>
<li id="2">Value 2 </li>
<li id="3">Value 3 </li>
</ul>
<ul class="sortable" id="list-B">
<li id="4">Value 1 </li>
<li id="5">Value 2 </li>
<li id="6">Value 3 </li>
</ul>
像这样连接
$( ".sortable" ).sortable({
connectWith: '.sortable',
placeholder: "widget-highlight"
});
我知道如何通过保存订单将一个有序列表保存到数据库 但如果用户将项目从列表a移动到列表b ?
,如何保存我想保存项目位置,但是
答案 0 :(得分:5)
使用.sortable()
的{{1}}回调,通过.receive()
获取已删除节点的.index()
。如何在PHP中处理它取决于你的ajax处理程序的设置方式。
ui.item.index()
以上示例将在$( ".sortable" ).sortable({
connectWith: '.sortable',
placeholder: "widget-highlight",
// Receive callback
receive: function(event, ui) {
// The position where the new item was dropped
var newIndex = ui.item.index();
// Do some ajax action...
$.post('someurl.php', {newPosition: newIndex}, function(returnVal) {
// Stuff to do on AJAX post success
});
},
// Likewise, use the .remove event to *delete* the item from its origin list
remove: function(event, ui) {
var oldIndex = ui.item.index();
$.post('someurl.php', {deletedPosition: oldIndex}, function(returnVal) {
// Stuff to do on AJAX post success
});
}
});