尝试获取子菜单工作的可排序列表

时间:2014-03-30 22:48:39

标签: php jquery jquery-ui

过去几天我一直在努力找出可排序的列表。我正在开发一个项目,允许用户通过将链接拖到他们想要的位置(包括子菜单(下拉菜单))来订购导航/菜单。我已经经历了stackoverflow帖子和googled尽可能多的打瞌睡。我有点想要它,但我不能让它从主菜单和子菜单中提醒整个字符串。理想情况下,我想要一个可以存储在数据库中的整个事物的序列化字符串。这就是我所拥有的,我整天都在搅拌和捣碎,所以我试图去掉我所知道的不需要的东西,任何帮助都会非常感激。

我使用Jquery UI以及Bootstrap 3。

<div id="example5">            
  <ul class="list-group">
      <li id="1" class="list-group-item menlink">11111</li>
      <li id="2" class="list-group-item menlink">22222</li>
      <li id="3" class="list-group-item menlink">33333</li>
      <li id="4" class="list-group-item menlink">44444
        <ul class="list-group">
          <li id="6" class="list-group-item menlink">66666</li>
          <li id="7" class="list-group-item menlink">77777</li>
          <li id="8" class="list-group-item menlink">88888</li>
          <li id="9" class="list-group-item menlink">99999</li>
        </ul>
      </li>
      <li id="5" class="list-group-item menlink">55555</li>
    </ul>  
</div> 

<script>
  $("#example5 ul").sortable({
        connectWith: "#example5 ul",
        placeholder: "ui-state-highlight",
    update : function(event, ui) {
         var order = $(this).sortable('toArray').toString();
        alert(order);

    }
  });
</script> 

1 个答案:

答案 0 :(得分:0)

html元素不能以数字开头。您需要在每个li ID中的数字之前添加某种文本。

我只更改了一些代码。

$("#example5").sortable({
    connectWith: "#example5 ul",
    items: "li",
    placeholder: "ui-state-highlight",
    update : function(event, ui) {
       var order = $(this).sortable('toArray').toString();
       var serial = $(this).sortable('serialize');
       alert(order);
       alert(serial);

    }
 });

Here is a fiddle.