如何在 laravel 8 中保存嵌套的下拉菜单
Posted
技术标签:
【中文标题】如何在 laravel 8 中保存嵌套的下拉菜单【英文标题】：how can I save nested dropdown menu in laravel 8 【发布时间】：2021-12-12 12:08:18 【问题描述】：我有一个嵌套的下拉菜单，它显示来自数据库的数据，我想在选择它时获取数据的 ID，我也希望能够多选，但我不能，因为我什至无法获得对应于该特定数据的 id。
我正在尝试实现一种用户可以轻松浏览数据并能够进行多选的方式，到目前为止我已经实现了浏览。
这是模型
`
<?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>
希望有人能帮帮我。
【问题讨论】：
您可以使用带有 parent_id 列（可为空）的单个表。如果 parent_id 为 null，则它是父菜单项。如果有 parent_id 它是一个子项。 已经完成了，我的问题是现在如何保存。 【参考方案1】：我无法为您的代码提供帮助。但我可以向您展示我是如何完成类别子类别选择框的。我的类别模型：
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
子类别显示在类别名称前面和主类别正下方。
【讨论】：
我正在使用与您类似的代码很好地显示和保存它，但现在我对保存数据的方式有疑问，它不是为数组值开始一个新字段，而是将它们保留在像这样的一个字段 ["4","7","9","12","18","19","20"] 但我希望他们拥有自己的字段。 多选将只返回数组中的数据。以上是关于如何在 laravel 8 中保存嵌套的下拉菜单的主要内容，如果未能解决你的问题，请参考以下文章
laravel，在另一个表的下拉列表中显示数据，但保存在当前表中
Laravel 4 如何使用 input::old() 方法在下拉菜单中显示选定的值？