dsfr_collection_check_boxes
Génère un groupe de <input type="checkbox"> au DSFR à partir d'une collection.
Documentation DSFR - Case à cocher
Usage basique
<%= f.dsfr_collection_check_boxes :interests, interest_collection, :id, :name, legend: "Centres d'intérêt" %><fieldset class="fr-fieldset">
<legend class="fr-fieldset__legend--regular fr-fieldset__legend">Centres d'intérêt</legend>
<input type="hidden" name="usage-basique[interests][]" value="" autocomplete="off" />
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="usage-basique[interests][]" value="sport" id="usage-basique_interests_sport" type="checkbox" />
<label class="fr-label" for="usage-basique_interests_sport">Sport</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="usage-basique[interests][]" value="music" id="usage-basique_interests_music" type="checkbox" />
<label class="fr-label" for="usage-basique_interests_music">Musique</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="usage-basique[interests][]" value="travel" id="usage-basique_interests_travel" type="checkbox" />
<label class="fr-label" for="usage-basique_interests_travel">Voyage</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="usage-basique[interests][]" value="reading" id="usage-basique_interests_reading" type="checkbox" />
<label class="fr-label" for="usage-basique_interests_reading">Lecture</label>
</div>
</div>
</fieldset>Options disponibles
| Option | Type | Description |
|---|---|---|
legend: | String | Titre du groupe (obligatoire) |
hint: | String | Texte d'aide affiché sous la légende |
inline: | Boolean | Affichage en ligne des cases |
name: | String | Nom personnalisé pour les champs |
Paramètres
| Paramètre | Description |
|---|---|
method | Nom de l'attribut du modèle |
collection | Collection d'objets à afficher |
value_method | Méthode pour obtenir la valeur (ex: |
text_method | Méthode pour obtenir le texte (ex: |
Signature
dsfr_collection_check_boxes(method, collection, value_method, text_method, opts = {}, html_options = {})Avec texte d'aide
<%= f.dsfr_collection_check_boxes :interests, interest_collection, :id, :name, legend: "Centres d'intérêt", hint: "Sélectionnez un ou plusieurs choix" %><fieldset class="fr-fieldset">
<legend class="fr-fieldset__legend--regular fr-fieldset__legend">Centres d'intérêt<span class="fr-hint-text">Sélectionnez un ou plusieurs choix</span></legend>
<input type="hidden" name="hint[interests][]" value="" autocomplete="off" />
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="hint[interests][]" value="sport" id="hint_interests_sport" type="checkbox" />
<label class="fr-label" for="hint_interests_sport">Sport</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="hint[interests][]" value="music" id="hint_interests_music" type="checkbox" />
<label class="fr-label" for="hint_interests_music">Musique</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="hint[interests][]" value="travel" id="hint_interests_travel" type="checkbox" />
<label class="fr-label" for="hint_interests_travel">Voyage</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="hint[interests][]" value="reading" id="hint_interests_reading" type="checkbox" />
<label class="fr-label" for="hint_interests_reading">Lecture</label>
</div>
</div>
</fieldset>Affichage inline
<%= f.dsfr_collection_check_boxes :interests, interest_collection, :id, :name, legend: "Centres d'intérêt", inline: true %><fieldset class="fr-fieldset">
<legend class="fr-fieldset__legend--regular fr-fieldset__legend">Centres d'intérêt</legend>
<input type="hidden" name="inline[interests][]" value="" autocomplete="off" />
<div class="fr-fieldset__element fr-fieldset__element--inline">
<div class="fr-checkbox-group">
<input name="inline[interests][]" value="sport" id="inline_interests_sport" type="checkbox" />
<label class="fr-label" for="inline_interests_sport">Sport</label>
</div>
</div>
<div class="fr-fieldset__element fr-fieldset__element--inline">
<div class="fr-checkbox-group">
<input name="inline[interests][]" value="music" id="inline_interests_music" type="checkbox" />
<label class="fr-label" for="inline_interests_music">Musique</label>
</div>
</div>
<div class="fr-fieldset__element fr-fieldset__element--inline">
<div class="fr-checkbox-group">
<input name="inline[interests][]" value="travel" id="inline_interests_travel" type="checkbox" />
<label class="fr-label" for="inline_interests_travel">Voyage</label>
</div>
</div>
<div class="fr-fieldset__element fr-fieldset__element--inline">
<div class="fr-checkbox-group">
<input name="inline[interests][]" value="reading" id="inline_interests_reading" type="checkbox" />
<label class="fr-label" for="inline_interests_reading">Lecture</label>
</div>
</div>
</fieldset>Avec nom personnalisé
Utile pour des formulaires complexes ou des nested attributes.
<%= f.dsfr_collection_check_boxes :interests, interest_collection, :id, :name, legend: "Centres d'intérêt", name: "user[interest_ids][]" %><fieldset class="fr-fieldset">
<legend class="fr-fieldset__legend--regular fr-fieldset__legend">Centres d'intérêt</legend>
<input type="hidden" name="user[interest_ids][]" value="" autocomplete="off" />
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="user[interest_ids][]" value="sport" id="name_interests_sport" type="checkbox" />
<label class="fr-label" for="name_interests_sport">Sport</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="user[interest_ids][]" value="music" id="name_interests_music" type="checkbox" />
<label class="fr-label" for="name_interests_music">Musique</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="user[interest_ids][]" value="travel" id="name_interests_travel" type="checkbox" />
<label class="fr-label" for="name_interests_travel">Voyage</label>
</div>
</div>
<div class="fr-fieldset__element">
<div class="fr-checkbox-group">
<input name="user[interest_ids][]" value="reading" id="name_interests_reading" type="checkbox" />
<label class="fr-label" for="name_interests_reading">Lecture</label>
</div>
</div>
</fieldset>