В этом руководстве мы покажем, как использовать Laravel для создания древовидного списка категорий в HTML select. Мы начнем с создания проекта Laravel, определим модель Category, настроим фабрику для заполнения данных категорий и создадим представление для отображения древовидного списка в HTML select.
Для начала создадим новый проект Laravel с использованием Composer. Откройте терминал и выполните команду:
composer create-project --prefer-dist laravel/laravel categories-app
Перейдите в каталог вашего проекта:
cd categories-app
Создадим модель Category
с миграцией для таблицы категорий:
php artisan make:model Category -m
Редактируйте миграцию create_categories_table
для добавления поля parent_id
:
// database/migrations/create_categories_table.php
public function up()
{
Schema::create('categories', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->unsignedBigInteger('parent_id')->nullable();
$table->timestamps();
});
}
Запустите миграции для создания таблицы категорий:
php artisan migrate
Создайте фабрику для модели Category
:
php artisan make:factory CategoryFactory --model=Category
Отредактируйте фабрику CategoryFactory
для заполнения данных:
// database/factories/CategoryFactory.php
use App\Models\Category;
use Illuminate\Database\Eloquent\Factories\Factory;
class CategoryFactory extends Factory
{
protected $model = Category::class;
public function definition()
{
return [
'name' => $this->faker->unique()->word,
'parent_id' => null, // Родительские категории пока пустые
];
}
}
Запустите фабрику для создания тестовых данных:
php artisan tinker
// Создаем 10 категорий с помощью фабрики
Category::factory()->count(10)->create();
exit
Отредактируйте метод getCategoryOptions
в модели Category
для формирования древовидной структуры:
// app/Models/Category.php
namespace App\Models;
use Illuminate\Database\Eloquent\Model;
class Category extends Model
{
public function children()
{
return $this->hasMany(Category::class, 'parent_id');
}
public static function getCategoryOptions($categories, $prefix = '-')
{
// Реализация метода getCategoryOptions, как упомянуто в предыдущих примерах
}
}
Создайте контроллер CategoryController
с методом create
для передачи данных в представление:
// app/Http/Controllers/CategoryController.php
namespace App\Http\Controllers;
use App\Models\Category;
use Illuminate\Http\Request;
class CategoryController extends Controller
{
public function create()
{
$categories = Category::with('children')->whereNull('parent_id')->get();
$categoryOptions = Category::getCategoryOptions($categories);
return view('categories.create', compact('categoryOptions'));
}
}
Создайте представление create.blade.php
для отображения HTML select с древовидными категориями:
<!-- resources/views/categories/create.blade.php -->
<select name="category_id">
<option value="">Выберите категорию</option>
@foreach($categoryOptions as $categoryId => $categoryName)
<option value="{{ $categoryId }}">
{{ $categoryName }}
</option>
@endforeach
</select>
Настройте маршрут для использования контроллера и метода:
// routes/web.php
use App\Http\Controllers\CategoryController;
Route::get('/categories/create', [CategoryController::class, 'create']);
Теперь посетив соответствующий маршрут, вы увидите HTML select с древовидной структурой категорий, отображаемых в виде вложенных опций.
Это руководство позволяет вам создать и заполнить базу данных категорий, а затем вывести их в HTML select с древовидной структурой при помощи Laravel.
Коментарии отсутствуют, будьте первым(ой) кто напишет под этим постом!
Написать коментарий