Champ de formulaire utilisé pour sélectionner une ou plusieurs valeurs dans la liste.
Documentation : Figma
Langage: HTML
<div class="ds-check-card">
<div class="ds-check-card-left">
<div class="form-check">
<input class="form-check-input" id="form-checkbox_25712544" name="checkbox-card" type="checkbox" value="checkbox-value_539482442">
<label class="form-check-label sr-only" for="form-checkbox_25712544">
Libellé de l'élément</label>
</div>
</div>
<div class="ds-check-card-right">
<p class="mb-0 emphasis" aria-hidden="true">Libellé de l'élément</p>
<p class="mb-0 text-gray-70">Lorem ipsum dolor sit amet.</p>
</div>
</div>
// L'aperçu n'est pas disponible pour les dépendances externes
window.addEventListener('load', function () {
/**
* Désactivation du clic sur les input disabled
*/
// On liste les input disabled
const disabledInputs = document.querySelectorAll('[aria-disabled="true"]');
for (const input of disabledInputs) {
// Pour chaque input on empêche le click
input.addEventListener('click', function (e) {
e.preventDefault();
e.stopPropagation();
});
// Pour chaque label associé, on empêche le click
const label = document.querySelector('[for="' + input.id + '"]');
if (label) {
document.querySelector('[for="' + input.id + '"]').addEventListener('click', function (e) {
e.preventDefault();
e.stopPropagation();
});
}
}
});