J'ai un formulaire avec plusieurs cases à cocher et, au-dessous de chacune de ces cases à cocher, un ensemble de boutons radio. Je veux désactiver et réinitialiser les boutons radio lorsque la case à cocher correspondante n'est pas cochée ou non cochée.
J'ai essayé d'activer les boutons radio à l'aide du sélecteur JQuery : radio [nom = vid] code> mais ça ne fait pas " t Travaux. P>
<form action='matrix.php' method='post' id='formanal' name='formanal'>
<ul class="desc">
<li><label><input type="checkbox" id ="1" value="Couleur des tarses" name="1">Couleur des tarses</label></li>
<ul>
<li class="valeur"><label><input type="radio" value="1-1" id="1-1" name="v1" disabled>Jaunes</label></li>
<li class="valeur"><label><input type="radio" value="1-2" id="1-2" name="v1" disabled>Blancs</label></li>
</ul>
</ul>
...
<ul class="desc">
<li><label><input type="checkbox" id ="8" value="Forme des ailes" name="8">Forme des ailes</label></li>
<ul>
<li class="valeur"><label><input type="radio" value="8-15" id="8-15" name="v8" disabled>Pliées en long</label></li>
<li class="valeur"><label><input type="radio" value="8-16" id="8-16" name="v8" disabled>Ãtalées en toit</label></li>
</ul>
</ul>
<input type='submit' name='action' value='Valider'></div>
</form>
$(document).ready(function() {
$("form input:checkbox").change(function() {
var vid = 'v' + this.id;
var etat = $(this).prop('checked');
if (etat) {
$(':radio[name=vid]').prop('disabled', false);
} else {
$(':radio[name=vid]').prop('checked', false);
$(':radio[name=vid]').prop('disabled', true);
}
});
});
3 Réponses :
Votre problème ici est la concaténation, vous devez concatez pour ajouter une variable Votre code doit être Comme ceci: p> p> $(document).ready(function() {
$("form input:checkbox").change(function() {
var vid = 'v' + this.id;
var etat = $(this).prop('checked');
if (etat) {
$(':radio[name='+vid+']').prop('disabled', false);
} else {
$(':radio[name='+vid+']').prop('checked', false);
$(':radio[name='+vid+']').prop('disabled', true);
}
});
});
Dans jQuery, vous devez obtenir les radiobuttons du parent p>
code> de la case code> comme ceci:
$ (this) .cousest ('ul' )Find ("Entrée [Type = 'Radio']") ") Code>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action='matrix.php' method='post' id='formanal' name='formanal'>
<ul class="desc">
<li><label><input type="checkbox" id ="1" value="Couleur des tarses" name="1"> Couleur des tarses</label></li>
<ul>
<li class="valeur"><label><input type="radio" value="1-1" id="1-1" name="v1" disabled> Jaunes</label></li>
<li class="valeur"><label><input type="radio" value="1-2" id="1-2" name="v1" disabled> Blancs</label></li>
</ul>
</ul>
<ul class="desc">
<li><label><input type="checkbox" id ="8" value="Forme des ailes" name="8"> Forme des ailes</label></li>
<ul>
<li class="valeur"><label><input type="radio" value="8-15" id="8-15" name="v8" disabled> Pliées en long</label></li>
<li class="valeur"><label><input type="radio" value="8-16" id="8-16" name="v8" disabled> Ãtalées en toit</label></li>
</ul>
</ul>
</form>
Merci beaucoup. La concaténation doit être la solution. J'ai besoin d'utiliser jQuery car il existe un nombre non défini de cases à cocher et de leurs boutons radio.
Ma solution fonctionne pour des cases à cocher infinies et des radiobuttons.
Je ferais quelque chose comme ça. Vous n'avez même pas besoin de jQuery ...
La variable code> vid code> à l'intérieur de votre sélecteur est en cours de traitement comme une chaîne littérale, vous devez le concaténer:
$ (': radio [nom = "' + vid + '"]') < / code>