php - PHP jQuery 更新可排序的嵌套菜单

Question

我有一个嵌套菜单，它是一个带有子菜单的菜单。我正在尝试使用 jquery 可排序的接口http://jqueryui.com/sortable/#portlets

您可以对菜单进行排序，但我想保存更改。我的数据库如下所示：

+---------+-----------+------+
| item_id | parent_id | name |
+---------+-----------+------+
| 1       | 0         | Home |
+---------+-----------+------+
| 2       | 0         | Test |
+---------+-----------+------+
| 3       | 2         | Bla  |
+---------+-----------+------+
| 4       | 0         | Baa  |
+---------+-----------+------+

我的可排序菜单看起来像

<div class="column">
  <div class="portlet">
    <div class="portlet-header">Home</div>
  </div>
</div>

<div class="column">
  <div class="portlet">
<div class="portlet-header">Test</div>
  </div>

  <div class="portlet">
<div class="portlet-header">Bla</div>
  </div>
</div>

<div class="column">
  <div class="portlet">
<div class="portlet-header">Baa</div>
  </div>
</div>

我的 jQuery 看起来像

$(function() {
  $( ".column" ).sortable({
    connectWith: ".column",
    update: function() {
    }    

  });

  $( ".portlet" ).addClass( "ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" )
    .find( ".portlet-header" )
    .addClass( "ui-widget-header ui-corner-all" )
    .end()
});

我怎样才能知道菜单项的新位置是什么？

Answer 1

这应该向您显示订单。并按照它们在文档中的顺序将其存储在一个数组中。

var menu = new Array();
var order = 0;

$(".portlet-header").each(function(){
    menu.push($(this).html());
    alert(order + ":" + $(this).html());
    order += 1;
});