[Résolu] Affichage d'une ligne html sous condition

Bonjour,
Dans un formulaire HTML j'ai des boutons type radio où je voudrais qu'en fonction du résultat s'affiche une ligne supplémentaire de saisie.

<form action="/Test_affichage_ligne.php" method="post">
En avez vous entendu parler ? 
<input id=ajout type=radio name=option value=oui> Oui 
<input id=ajout type=radio name=option value=non> Non<br>
</form>	

<script type="text/javascript" src="/JsQuery/jquery_dev/jquery-v1.9.1.js"></script>
<script type="text/javascript" src="/JsQuery/jquery_dev/jquery-ui.js"></script>
<script>
$(function() {
  var valeur = $('input[type=radio][name=option]:checked').val(); 
   if (valeur == "oui") {
      $("#ajout").append("De quelle manière ? <input type=text name=maniere><br>");
   }
});
</script>

Voilà j'affiche bien mes boutons, mais quand je clique sur Oui, rien ne se passe, je n'affiche pas la ligne de l'append du jquery.
Les src jquery...js sont bien au bon endroit sur mon disque.
Pouvez vous me dire mon erreur ?
Merci d'avance.

Salut,

En fait là tu récupères la valeur de ton input et tu testes si cette valeur est égale à la chaine "oui". Tout cela au chargement de la page.

Si tu souhaites faire cette vérifications quand tu cliques, il faut utiliser un évènement de clique sur cet input. Tu n'es pas loin .

Merci de la réponse, voilà la modif, mais çà ne marche toujours pas !!

<form action="/Test_affichage_ligne.php" method="post">
<div id=ajout>En avez vous entendu parler ? 
<input  type=radio name=option value=oui> Oui 
<input  type=radio name=option value=non> Non<br>
</div></form>	

<script type="text/javascript" src="/JsQuery/jquery_dev/jquery-v1.9.1.js"></script>
<script type="text/javascript" src="/JsQuery/jquery_dev/jquery-ui.js"></script>
<script>
$(document).ready(function() {
   $("#ajout").click(function(){
      var valeur = $("input[type=radio][name=option]:checked").val(); 
      if (valeur == "oui") {
         $("#ajout").append("De quelle manière ? <input type=text name=maniere><br>");
      }
	}
});
</script>

Merci

Bonjour,

C'est du détail, mais plutôt qu'utiliser l'événement click() sur la div parente, il faudrait plutôt utiliser l'événement change() sur les boutons radio. Parce que pour l'instant, le petit test actuel est appelé même s'il l'on clic sur le texte "En avez vous entendu parler ?", ce qui n'est pas l'effet escompté.
Également, il est possible d'utiliser la notation $('input[name="option"]').prop("checked") qui renverra directement un booléen.

Bonjour,
Çà marche bien avec l'événement change, merci beaucoup.
Bonne journée

N'oublie pas de passer le topic en résolu

ok c'est fait, merci et bonne soirée
Modifié par pat16 (08 Dec 2015 - 18:16)