Question

有许多使用jQuery可排序列表更新数据库的示例，其中包括序列化列表的id，然后根据id序列更新数据库。

现在问题是我想使用jQuery可排序连接列表来插入和更新数据库。我有两个清单。

来源清单：

<ul id="admin_news_all">
    <li id="2588" class="ui-draggable">
    <li id="2678" class="ui-draggable">
    <li id="2680" class="ui-draggable">
    <li id="2690" class="ui-draggable">
    <li id="2692" class="ui-draggable">
    <li id="2694" class="ui-draggable">
    <li id="2696" class="ui-draggable">
    <li id="2698" class="ui-draggable">
    <li iid="2696" class="ui-draggable">
    <li id="2704" class="ui-draggable">
</ul>

目标列表：

<ul id="news_box_top" class="ui-sortable">
    <li class="ui-draggable" style="display: list-item; id="2686"">
    <li class="ui-draggable" style="display: list-item; id="2496"">
</ul>

我已将jQuery初始化为：

$("#news_box_top").sortable()
$("#admin_news_all li").draggable({
    helper: "clone",
    revert: "invalid",
    connectToSortable:'#news_box_top'
});

现在我希望将项目从源列表移动到目标列表，然后在单击button元素时更改（插入和更新操作）数据库。

目标数据库：MySql

id int(12), position int(2)

Answer 1

首先，我认为你的第二个清单应该是这样的：

<ul id="news_box_top" class="ui-sortable">
  <li class="ui-draggable" id="2686" style="display: list-item; ">
  <li class="ui-draggable" id="2496" style="display: list-item; ">
</ul>

然后我假设您知道如何更新您的数据库，我只是帮助构建一个数组whit排序ID：

ids = [];
$('#news_box_top li.ui-draggable').toArray().forEach( function (el) {
  // Here I assume the element has an id
  ids.push( $(el).attr('id') );
});

使用可排序列表插入和更新数据库

1 个答案: