如何在 laravel 8 中保存嵌套下拉菜单

Question

我有一个嵌套的下拉菜单，它显示来自数据库的数据，我想在我 select 时获取数据的 ID，我也希望能够 multiselect 但我不能，因为我什至无法获得与该特定数据对应的 ID。

我正在尝试实现一种用户可以轻松浏览数据并能够进行多select 的方式，到目前为止我实现了浏览。

这是模特

`

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Menu extends Model
{
    use HasFactory;

    protected $fillable = ['functional_area','parent_id'];
    public function parent()
    {
        return $this->hasOne('App\Models\Menu', 'id', 'parent_id')->orderBy('sort_order');
    }

    public function children()
    {

        return $this->hasMany('App\Models\Menu', 'parent_id', 'id')->orderBy('sort_order');
    }

    public static function tree()
    {
        return static::with(implode('.', array_fill(0, 100, 'children')))->where('parent_id', '=', '0')->orderBy('sort_order')->get();
    }
}`

这是我的控制器 `

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class MenuController extends Controller
{
    public function getMenu()
    {
        $menu = new \App\Models\Menu;
        $menuList = $menu->tree();
        return view('index')->with('menulist', $menuList);
    }
   

}

` 这是它的索引

`

<body>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css" integrity="sha512-1PKOgIY59xJ8Co8+NE6FZ+LOAZKjy+KY8iq0G4B3CyeY6wYHN3yt9PW0XpSriVlkMXe40PTKnXrLnZ9+fkDaog==" crossorigin="anonymous" />
    <style>
        .dropdown-menu .nav-item a { color: #000 !important; }
        .dropdown-toggle:after { content: none; }
        .dropdown-menu .dropdown-menu { margin-left: 0; margin-right: 0; }
        .dropdown-menu li { position: relative }
        .nav-item .submenu { display: none; position: absolute; left: 100%; top: -7px; }
        .dropdown-menu>li:hover { background-color: #f1f1f1; }
        .dropdown-menu>li:hover>.submenu { display: block; }
    </style>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <a class="navbar-brand"></a>
        <ul class="navbar-nav mr-auto">
            @each('submenu', $menulist, 'menu', 'empty')

        </ul>
    </nav>

    <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
    <script type="text/javascript">

        $(document).on('click', '.dropdown-menu', ($event) => $event.stopPropagation());
        if ($(window).width() < 992) {
            $('.dropdown-menu a').click(($event) => {
                $event.preventDefault();
                if ($(this).next('.submenu').length) {
                    $(this).next('.submenu').toggle();
                }
                $('.dropdown').on('hide.bs.dropdown', () => $(this).find('.submenu').hide());
            });
        }

    </script>
</body>

它的子菜单

@if ((count($menu->children) > 0) AND ($menu->parent_id > 0))
<li class="nav-item dropdown">
    <a href="" class="nav-link dropdown-toggle" role="button" data-toggle="dropdown">
        {{ $menu->functional_area }}
        @if(count($menu->children) > 0)
        <i class="fa fa-caret-right"></i>
        @endif
    </a>
    @else
<li class="nav-item @if($menu->parent_id === 0 && count($menu->children) > 0) dropdown @endif">
    <a href="" class="nav-link dropdown-toggle" data-toggle="dropdown">
        {{ $menu->functional_area }}
        @if(count($menu->children) > 0)
            <i class="fa fa-caret-down"></i>
        @endif
    </a>
    @endif
    @if (count($menu->children) > 0)
    <ul class="@if($menu->parent_id !== 0 && (count($menu->children) > 0)) submenu @endif dropdown-menu" aria-labelledby="dropdownBtn">
        @foreach($menu->children as $menu)
        @include('submenu', $menu)
        @endforeach
    </ul>
    @endif
</li>

希望有人能帮助我。

Answer 1

我无法帮助您处理代码。但我可以向您展示我是如何完成类别子类别 select 框的。我的类别型号：

class Category extends Model
{
    use HasFactory;

    protected $fillable = [
        'parent_id',
        'category_name',
        'description',
        'image',
        'slug',
        'status',
    ];

    public function children()
    {
        return $this->hasMany(self::class, 'parent_id', 'id');
    }

    public function parent()
    {
        return $this->belongsTo(self::class, 'parent_id');

    }  

}

控制器：

public function create()
{
    $categories = Category::where('parent_id', 0)->orderby('category_name', 'asc')->get();
    return view('dashboards.admins.category.create', compact('categories'));
}

观看次数：create.blade.php

                            <div class="form-group">
                                @php $dashes = ' -- ' @endphp
                                <label>Select parent category*</label>
                                <select type="text" name="parent_id" class="form-control">
                                    <option value="0">None</option>
                                    @foreach($categories as $category)
                                    <option value="{{ $category->id }}">{{ $category->category_name }}</option>                                         
                                        @php $newDashes = $dashes . ' -- ' @endphp                                            
                                        @foreach ($category->children as $sub)                                              
                                          @include('/dashboards/admins/category/subcategories', ['cat' => $sub, 'dashes' => $newDashes,'parent_id' => ''] )
                                        @endforeach                                       
                                    
                                    @endforeach
                                </select>
                            </div>

并且要包含在 creae.blade 中的部分视图 - 已命名 - subcategories.blade

    <option value="{{ $cat->id }}" @if($cat->id == $parent_id) " selected "   @endif >{{ $dashes }}{{  $cat->category_name}}</option>
    @php $newDashes = $dashes. ' -- ' @endphp
    @foreach ($cat->children as $sub)
      @include('/dashboards/admins/category/subcategories', ['cat' => $sub, 'dashes' => $newDashes])
    @endforeach

子类别显示在类别名称前面和主类别的正下方。

如何在 laravel 8 中保存嵌套下拉菜单

how can I save nested dropdown menu in laravel 8

php

laravel

bootstrap-4

laravel-8