PHP jQuery更新可排序嵌套菜单


PHP jQuery update sortable nested menu

我有一个嵌套菜单,它是一个带有子菜单的菜单。我试图使一个界面与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()
});

如何找到菜单项的新位置?

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

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