仅显示与 select 选项中的类别相关的子类别 laravel

Question

我只想显示与之前在 laravel 中使用动态 select 下拉菜单选择的类别相关的子类别。

这是我的代码

<div class="form-group">
        <label>Category</label>
        <select id="categoryList" class="form-control" name="category_id" required>
            @foreach ($categories as $category)
                <option value="{{ $category->id }}">{{ $category->name }}</option>
            @endforeach
        </select>

        <label>Subcategory</label>
        <select id="subcategoryList" class="form-control" name="subcategory_id" required>
            @foreach ($subcategories as $subcategory)
                <option value="{{ $subcategory->id }}">{{ $subcategory->name }}</option>
            @endforeach
        </select>
    </div>

非常感谢 TIA 的任何帮助！

已编辑*

这是类别和子类别的模型

类别

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Category extends Model

{
    public $timestamps = false;

public function subcategories()
{
    return $this->hasMany('App\Subcategory');
}
}

子类别

 <?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Subcategory extends Model
{
    public $timestamps = false;

    public function category()
    {
        return $this->belongsTo('App\Category', 'category_id');
    }
}

Answer 1

如果列表不是太大或不需要 ajax，通常我会将 category_id 添加为 class 子类别选项，然后将其隐藏直到选择父类别。

假设您与类别的关系列是 category_id 代码如下所示：

<label>Subcategory</label>
<select id="subcategoryList" class="form-control" name="subcategory_id" required disabled>
    @foreach ($subcategories as $subcategory)
        <option value="{{ $subcategory->id }}" class='parent-{{ $subcategory->category_id }} subcategory'>{{ $subcategory->name }}</option>
    @endforeach
</select>

这里 jquery 这样做：

$('#categoryList').on('change', function () {
    $("#subcategoryList").attr('disabled', false); //enable subcategory select
    $("#subcategoryList").val("");
    $(".subcategory").attr('disabled', true); //disable all category option
    $(".subcategory").hide(); //hide all subcategory option
    $(".parent-" + $(this).val()).attr('disabled', false); //enable subcategory of selected category/parent
    $(".parent-" + $(this).val()).show(); 
});

仅显示与 select 选项中的类别相关的子类别 laravel

Only show the subcategories related to the category in select option laravel

jquery

html-select

laravel