Questionnaire en Javascript

22 octobre 2008 à 22:34:09

Bonjour à tous

J'aimerais réaliser un questionnaire en javascript avec une seule page de code.
Voici le début de ce questionnaire.

Le problème c'est qu'arrivé à la question 1, quand je clique sur mon bouton continuer ca ne marche pas. Et aussi, sous firefox arrivé à la question 1 la page se charge continuellement...

Comment résoudre ces problèmes? Merci d'avance! Voici le code:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Questionnaire</title>
      <link rel="stylesheet" type="text/css" href="" />
</head>
 
   <script type="text/javascript">
<!--
function question1() {
	document.write('<img src="image1_1.jpg" alt="image1_1"/>');
	document.write('<p>Question 1</p>');
	document.write('<form id="formulaire" method="post">');
	document.write('<input type="checkbox" id="reponse1_1">Reponse 1_1</input><br/><input type="checkbox" id="reponse1_2">Reponse 1_2</input><br/>');
	document.write('<input type="checkbox" id="reponse1_3">Reponse 1_3</input><br/><input type="checkbox" id="reponse1_4">Reponse 1_4</input><br/>');
	document.write('<input type="button" value="Question suivante" onclick="question2();"/>');
	document.write('</form>');
	}
function question2() {
	document.write('<img src="image1_2.jpg" alt="image1_2"/>');
	document.write('<p>Question 2</p>');
	document.write('<form id="formulaire" method="post">');
	document.write('<input type="checkbox" id="reponse1_2_1">Reponse 1_2_1</input><br/><input type="checkbox" id="reponse1_2_2">Reponse 1_2_2</input><br/>');
	document.write('<input type="checkbox" id="reponse1_2_3">Reponse 1_2_3</input><br/><input type="checkbox" id="reponse1_2_4">Reponse 1_2_4</input><br/>');
	document.write('<input type="button" value="Question suivante" onclick="question1();"/>');
	document.write('</form>');
	}
//-->
  </script>
 <body>
<p><form method="post"><input type="button" onclick="question1()" value="Commencer le questionnaire!"/></p>

 </body>
</html>

Mallowigi

22 octobre 2008 à 22:38:54

plutot que de faire document.write, je te conseille de faire plutot des appendChild. document.write efface tout le html avant de write, ce qui fait qu'a la fin tu n'as plus que ton "</form>" quand tu clique sur ton bouton. Pas top.

Knightmare

22 octobre 2008 à 22:45:02

Salut, merci beaucoup de ton aide. Mais concretement que m'apporte le appendChild? Et aussi et surtout, comment s'utilise-t-il, parce que j'ai recherché vite fait et j'ai pas tout compris

Et sinon avec des document.write ca pourrait marcher également? Pourquoi mon code ne marche-t-il pas?

Mallowigi

22 octobre 2008 à 23:00:23

je te conseille d'aller lire le tuto sur le DOM et Javascript.

En gros ca te permet de voir ta page html comme un arbre, dont les noeuds seraient les balises. Et donc tu recupere l'endroit ou se trouve le click, avec un getElementById, et la apres tu rajoute ton image et ton formulaire.

Va voir le tuto sur DOM tu comprendras bcp mieux

Apres c'est peut etre pas le sujet du probleme, mais bon, au moins ce sera plus "logique", et peut etre que ca marchera mieux;

Knightmare

22 octobre 2008 à 23:12:15

Ok je vais aller lire merci encore