2

サブメニューのあるメニューであるネストされたメニューがあります。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()
});

メニュー項目の新しい位置を確認するにはどうすればよいですか?

4

1 に答える 1

2

これで注文が表示されるはずです。そして、ドキュメント内の順序で配列に格納します。

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

$(".portlet-header").each(function(){
    menu.push($(this).html());
    alert(order + ":" + $(this).html());
    order += 1;
});
于 2013-05-26T11:59:47.130 に答える