QCM en javascript !

Résolu/Fermé
adek-59 Messages postés 2 Date d'inscription samedi 10 mai 2014 Statut Membre Dernière intervention 11 mai 2014 - 10 mai 2014 à 21:21
adek-59 Messages postés 2 Date d'inscription samedi 10 mai 2014 Statut Membre Dernière intervention 11 mai 2014 - 11 mai 2014 à 11:10
Bonjour à vous !

J'aimerais créer un QCM sur les toitures végétales qui, en fonction des cases "radio" cochées, me donnerais 3 réponses "extensive" ; "semi-intensive" ou "intensive"

La partie HTML est déjà faite :

<h4> 1/ Quel est le materiau de votre support de toiture ?</h4>
				    <FORM>
    				<INPUT type="radio" name="choice" id="1"> Bois
    				<INPUT type="radio" name="choice" id="2"> Acier
    	         </FORM>
					<br>
 <h4> 2/ Quelle est l'inclinaison de votre toit ?</h4>
				    <FORM>
  				  <INPUT type="radio" name="choice" id="3"> <5% (3°)
        		          <INPUT type="radio" name="choice" id="4"> <20% (11°)
                </FORM>
					<br>
					<input type="button" id="boutonenvoie" name="button"   value="Afficher le résultat"
					onclick="calcul()">




Je galère pour la partie Javascript, je sais qu'il faut utiliser " document.getElementById " et déclarer les variables, mais je n'arrive pas à organiser tout ça !

Si les cases "Bois" et "<5%" sont cochées, alors message "extensive"
Si les cases "Bois" et "<20%" sont cochées, alors message "extensive"
Si les cases "Acier" et "<5%" sont cochées, alors message "intensive"
Si les cases "Acier" et "<5%" sont cochées, alors message "semi-intensive"

Une petite aide serait la bienvenue !
Merci pour vos réponses !


2 réponses

Utilisateur anonyme
11 mai 2014 à 06:56
salut,

html :

<body>
		<form>
			<h4> 1/ Quel est le materiau de votre support de toiture ?</h4>

			<input type="radio" name="choice" checked />
			Bois
			<input type="radio" name="choice" />
			Acier
			<br>
			<h4> 2/ Quelle est l'inclinaison de votre toit ?</h4>
			<input type="radio" name="inc" checked />
			<5% (3°)
			<input type="radio" name="inc" />
			<20% (11°)

			<br>
			<input type="button" id="boutonenvoie" value="Afficher le résultat" />
		</form>
<!-- tu met le JavaScript ici ---->
	</body>



et le javascript à placer juste avant la balise fermante </body>

<script type="text/javascript">
			var ch = document.getElementsByName('choice');
			var inc = document.getElementsByName('inc');
			document.getElementById('boutonenvoie').onclick = function() {
				if (ch[0].checked && (inc[0].checked || inc[1].checked)) {
					alert("extensive");
				}
				if (ch[1].checked) {
					alert(inc[0].checked ? "intensive" : "semi-intensive");
				}
			}
		</script>


bonne journée
0
adek-59 Messages postés 2 Date d'inscription samedi 10 mai 2014 Statut Membre Dernière intervention 11 mai 2014
11 mai 2014 à 11:10
Merci beaucoup pour ta réponse rapide !

Une dernière petite question concernant ce QCM :
Les cases "Bois" et "5%" sont déjà pré-cochées quand j'arrive sur la page du QCM.
Y-a-t-il un moyen pour qu'elles ne soient pas cochées ?

Bonne journée :)
0