Déclencher un évènement sur une checkbox ou un bouton radio avec jQuery

19 avril 2018 camillejg Laisser un commentaire

jQuery est un framework Ajax Javascript permettant notamment la manipulation et la gestion d’évènements sur les Dom HTML . Il est très utilisé afin de créer des animations sur des sites Internet, ou pour traiter des données en Ajax sur un formulaire par exemple pour ne pas avoir à recharger la page (contrôle de champs, affichages conditionnels, vérification du submit, …).

jQuery permet notamment de déclencher un évènement lorsque une checkbox de formulaire, ou un bouton radio, va être coché ou décoché. Cela permet par exemple d’afficher un champs supplémentaire dans certains cas, lancer des vérifications sur le nombre de cases cochées dans d’autres cas, … les possibilités sont quasi-illimitées et s’adapteront tout à fait à vos besoins.

// Traitements sur des cases à chocher
$("input[type=checkbox][name=name-checkbox]").change(function() {
  if(this.checked) {
    // Si la case est cochée, on fait des traitements
  }else if(!this.checked) {
    // Si la case est n'est pas cochée, on fait d'autres traitements
  }
});

// Traitements sur des boutons radio :
$("input[type=radio][name=name-radio]").change(function() {
  if($(this).val() == 'value1') {
    //Traitement si première case cochée
  }else if($(this).val() == 'value2') {
    // Traitement si deuxième case cochée
  }
});

Ce code est à inclure entre les balises <script> et </script> de votre code.


Articles associés