Plusieurs situations demandent à ce qu'un formulaire Web présente des options sous la forme d'une liste déroulante. C'est le cas, notamment, lorsqu'on doit ajouter un enregistrement dans une table qui contient une clé étrangère.
Pour saisir la valeur de la clé étrangère, on utilisera une liste déroulante dont les valeurs sont tirées de la table qui contient la clé primaire.
Voici comment monter un tel formulaire avec Laravel.
Pour retrouver les informations de la liste déroulante, il faut faire une requête Eloquent dans la table qui contient la clé primaire.
Ex :
$categories = Categorie::all();
Cette instruction donnera le résultat suivant :
Collection {#188 ▼
#items: array:3 [▼
0 => Categorie {#189 ▼
...
#attributes: array:4 [▼
"id" => 1
"description" => "Électroménagers"
"created_at" => null
"updated_at" => null
]
...
}
1 => Categorie {#190 ▼
...
#attributes: array:4 [▼
"id" => 2
"description" => "Meubles"
"created_at" => null
"updated_at" => null
]
...
}
2 => Categorie {#191 ▼
...
#attributes: array:4 [▼
"id" => 3
"description" => "Appareils électroniques"
"created_at" => null
"updated_at" => null
]
...
}
]
}
L'exemple précédent comporte une erreur importante au niveau de l'ergonomie : les champs apparaissent dans l'ordre où ils ont été ajoutés dans la base de donnée. Il serait beaucoup plus approprié de les faire apparaître en ordre alphabétique.
Ex :
$categories = Categorie::orderBy('description')->get();
Le champ listé dans le orderBy() doit être le même qui sera affiché dans la liste déroulante.
Maintenant qu'on a en main les données de la liste déroulante, on peut passer ces informations à la vue :
/**
* Affiche le formulaire pour ajouter un produit.
*
* @return IlluminateViewView
*/
public function create() : View
{
$categories = Categorie::orderBy('description')->get();
return view('produits.create', compact('categories'));
}
Pour remplir une liste déroulante directement en HTML, votre vue devra effectuer une boucle.
Ex :
<select class="form-control" id="categorie_id" name="categorie_id">
@foreach($categories as $categorie)
<option value="{{ $categorie->id }}" >{{ $categorie->description }}</option>
@endforeach
</select>
Il est possible d'ajouter un élément en haut de la liste pour inviter l'usager à faire une sélection :
<select class="form-control" id="categorie_id" name="categorie_id">
<option value="" selected>Veuillez choisir...</option>
@foreach($categories as $categorie)
<option value="{{ $categorie->id }}">{{ $categorie->description }}</option>
@endforeach
</select>
Dans certaines situations, vous pourriez avoir en main une collection générée en utilisant un pluck(). Vous n'aurez donc pas une collection de modèles mais bien un tableau associatif. Dans ce cas, vous devrez plutôt utiliser cette structure de code :
{{-- ici, $categories est un tableau associatif et non une collection de modèles --}}
<select class="form-control" id="categorie_id" name="categorie_id">
@foreach($categories as $id => $description)
<option value="{{ $id }}" >{{ $description }}</option>
@endforeach
</select>
▼Publicité
