在 PHP 中获取并显示 jQuery 可排序数组的顺序

Question

我使用 jQuery sortable 对表格中的页面进行排序以创建菜单并保存包含这些项目的数组。

表格页

标识 |蛞蝓

4 |蛞蝓-1

7 |蛞蝓-2

$('#pages_selection').sortable({
        items               : 'li:not(.empty)',
        connectWith         : '#pages_available, #pages_selection',
        placeholder         : 'sort-highlight',
        forcePlaceholderSize: true,
        zIndex              : 999999,
        update: function(event, ui) {
            $.ajax({
                type: 'POST',
                url: "{{ URL::route('menusaveAjax') }}",
                data: {
                    '_token': $('input[name=_token]').val(),
                    'id_menu': {{ $menu->id }},
                    'content': $('#pages_selection').sortable('toArray', {attribute: 'key'})
                }
            });
        }
    });

我的清单：

<ul class="todo-list" id="pages_selection">
   <li id="0" class="sort-highlight empty text-center">
      <i class="fas fa-sort-amount-down"></i> Drop here
   </li>             
   @foreach($selections as $k => $v)
   <li id="{{ $v }}" key="{{ $k }}">
     <span class="handle">
       <i class="fa fa-ellipsis-v"></i>
       <i class="fa fa-ellipsis-v"></i>
     </span>
     <span class="text">Page {{ $k }}</span>
   </li>
   @endforeach
</ul>

在数据库中，它是这样存储的：["slug-2","slug-1"]

现在我想创建我的菜单，所以我的逻辑是：

1. 来自标题菜单的请求，例如在菜单表中
2. 从 pages 表中检索此数据
3. 按照菜单表中定义的顺序在数组中创建菜单。

所以这就是我的工作：

$menu = MyMenu::where('name', 'header')->first();
$items = $menu->content
//Show $items
array:2 [▼
 0 => "slug-2"
 1 => "slug-1"
]
$pages = Page::whereIn('slug', $menu->content)->get(['id','title', 'slug'])->toArray();
//Show $pages
array:2 [▼
 0 => array:3 [▼
   "id" => 4
   "title" => "Slug 1"
   "slug" => "slug-1"
 ]
 1 => array:3 [▼
   "id" => 7
   "title" => "Slug 2"
   "slug" => "slug-2"
 ]
]

问题是：如果创建我的菜单，我的项目不是按照保存在数据库中的顺序（[“slug-2”，“slug-1”]）而是按照id的顺序...

我想要这个：

<nav>
    <ul>
        <li>
            <a href="/slug-2">Slug 2</a>
        </li>
        <li>
            <a href="/slug-1">Slug 1</a>
        </li>
    </ul>
</nav>

但我有这个：

<nav>
    <ul>
        <li>
            <a href="/slug-1">Slug 1</a>
        </li>
        <li>
            <a href="/slug-2">Slug 2</a>
        </li>
    </ul>
</nav>

如何做到这一点？我想我必须操作我的数组，但我不知道如何...

谢谢

Answer 1

尝试此解决方案，但未测试

在发送 AJAX 响应之前使用 array_reverse($array, true); 反转数组