jQuery UI Sortable，然后将订单写入数据库

Question

我想使用jQuery UI sortable函数允许用户设置订单，然后在更改时将其写入数据库并进行更新。有人可以写一个例子来说明如何做到吗？

Answer 1

jQuery UI sortable功能包括执行此操作的serialize方法。确实很简单。这是一个简单的示例，一旦元素的位置发生变化，该数据便立即将数据发送到指定的URL。$('#element').sortable({&nbsp; &nbsp; axis: 'y',&nbsp; &nbsp; update: function (event, ui) {&nbsp; &nbsp; &nbsp; &nbsp; var data = $(this).sortable('serialize');&nbsp; &nbsp; &nbsp; &nbsp; // POST to server using $.post or $.ajax&nbsp; &nbsp; &nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; data: data,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; type: 'POST',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; url: '/your/url/here'&nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; }});这是通过使用elements创建元素数组的id。因此，我通常会执行以下操作：<ul id="sortable">&nbsp; &nbsp;<li id="item-1"></li>&nbsp; &nbsp;<li id="item-2"></li>&nbsp; &nbsp;...</ul>使用该serialize选项时，它将创建一个POST查询字符串，如下所示：item[]=1&item[]=2等等。因此，如果您在id属性中使用（例如）数据库ID，则可以简单地遍历POSTed数组并相应地更新元素的位置。例如，在PHP中：$i = 0;foreach ($_POST['item'] as $value) {&nbsp; &nbsp; // Execute statement:&nbsp; &nbsp; // UPDATE [Table] SET [Position] = $i WHERE [EntityId] = $value&nbsp; &nbsp; $i++;}