11486 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'ai toujours eu recours au Javascript orienté DOM et en particulier au getElementById ce qui limite vite les possibilités, mais aujourd'hui, je tente de m'initier au jQuery et de solutionner un problème spécifique avec cette bibliothèque.

Ce que j'essaie de faire :
Vérifier si un des trois input radio est coché (prod_princ), et si c'est le cas, cocher la checkbox au dessus (is_pharma).
Comment puis-je faire cela en jQuery, svp?


<!-- J'ai bien sûr chargé jQuery dans le head script -->
<form>
<div class="input checkbox">
     <input type="hidden" name="is_pharma" value="0"/>
     <label for="is-pharma">
         <input type="checkbox" name="is_pharma" value="1" id="is-pharma">
             Consommation pharmacologique
    </label>
</div>
  
<div class="input radio">
    <input type="hidden" name="produit_princ" value=""/>
    <label for="produit-princ-cannabis">
        <input type="radio" name="produit_princ" value="Cannabis" id="produit-princ-cannabis">
            Cannabis
    </label>
    <label for="produit-princ-alcool">
        <input type="radio" name="produit_princ" value="Alcool" id="produit-princ-alcool">
         Alcool
    </label>
      <label for="produit-princ-tabac">
        <input type="radio" name="produit_princ" value="Tabac" id="produit-princ-tabac">
         Tabac
    </label>
</div>

</form>


Comme je suis une noob complète en jQuery, mon bousin ne fonctionne pas du tout :


var prodprinc = $('input[name=produit_princ]');
var ispharma = $('input[name=is_pharma]');

$(document).ready(function(){
  if prodprinc.is(':checked') { /* il faut surement un each quelque part vu qu'il y en a plusieurs ? */
    ispharma.checked;
  }
});


Puis-je vous demander un petit coup de pouce, svp? Smiley smile
D'avance, un grand merci !
Modifié par Reka (02 Dec 2015 - 09:20)
Administrateur
Au hasard
$('.input.radio :radio').on('change', function() {
  var check = $('.input.radio :radio:checked').length>0;
  $('#is-pharma').prop('checked',check);
});


Démo : http://codepen.io/anon/pen/xwvZwe

On peut faire encore plus simple avec une variante

$('.input.radio :radio').on('change', function() {
  $('#is-pharma').prop('checked', $(this).is(':checked'));
});
Purée, c'est effarant tant c'est à la fois court et simple.
Mon code js précédent faisait 15 lignes pour le même résultat... Smiley confused
Merci mille fois, Dew !