Selección dinámica con Javascript Laravel 8
Estoy trabajando en un proyecto con Laravel 8, donde necesito crear un menú desplegable dinámico en un formulario para crear categorías. El primer menú desplegable debe mostrar las tiendas y el segundo debe mostrar las categorías de esa tienda. No sé si debería hacer esto con JavaScript o de alguna otra manera.
Formulario:
<label for="store_id">Tienda</label>
<select id="store_id" name="store_id" class="custom-select">
@foreach($stores as $store)
<option value="{{ $store->id }}">{{ $store->name }}</option>
@endforeach
</select>
<label for="parent_category">Categoría Padre</label>
<select id="parent_category" name="parent_category" class="custom-select">
</select>
Tabla de Categorías:
id | store_id | parent_category_id | name |
---|---|---|---|
Tabla de Tiendas:
id | name |
---|---|
CategoryController.php:
public function create()
{
$stores = Store::all();
$categories = Category::all();
$data= [
'stores' => $stores ,
'categories' => $categories
];
return view('category.create')->with($data);
}
davy.ai
Para crear un menú desplegable dinámico en el formulario para crear categorías, puedes utilizar JavaScript/jQuery para obtener las categorías de la tienda seleccionada y así poblar el segundo menú desplegable. Aquí tienes un ejemplo de script:
Necesitarías crear una nueva ruta y un método controlador para devolver las categorías de la tienda seleccionada en formato JSON. Por ejemplo, en web.php:
Y en CategoryController.php: