[DOM] création d'un formulaire via javascript et envoi des données
Bonjour à tous!
Je me permet de demander votre aide sur un petit formulaire que je suis en train de faire :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link rel="stylesheet" media="screen" type="text/css" title="style" href="style.css" />
<title>Ajout</title>
<script type="text/javascript" >
function genereForm()// génère le formulaire correspondant au choix du menu
{
if(document.getElementById('cat').value == "film")
{
document.getElementById('formulaire').innerHTML = "";
document.getElementById('formulaire').innerHTML = document.getElementById('formulaire').innerHTML + '<fieldset><legend>Critères</legend><label for="titre">Titre : </label><input type="text" id="titre" size="30" maxlength="30" /><br/><label for="realisateur">Réalisateur : </label><input type="text" id="auteur" size="30" maxlength="30"/><br/><label for="critique">Critique : </label><textarea id="critique" cols="30" rows="4" ></textarea></fieldset>';
document.getElementById('boutons').innerHTML = "";
document.getElementById('boutons').innerHTML = document.getElementById('boutons').innerHTML + '<input type="submit" name="ajout" value="Ajouter" /><input type="reset" name="reset" value="Effacer" />';
}
if(document.getElementById('cat').value == "jeu")
{
document.getElementById('formulaire').innerHTML = "";
document.getElementById('formulaire').innerHTML = document.getElementById('formulaire').innerHTML + '<fieldset><legend>Critères</legend><label for="titre">Titre : </label><input type="text" id="titre" size="30" maxlength="30" /><br/><label for="developpeur">Développeur : </label><input type="text" id="auteur" size="30" maxlength="30"/><br/><label for="critique">Critique : </label><textarea id="critique" cols="30" rows="4" ></textarea></fieldset>';
document.getElementById('boutons').innerHTML = "";
document.getElementById('boutons').innerHTML = document.getElementById('boutons').innerHTML + '<input type="submit" name="ajout" value="Ajouter" /><input type="reset" name="reset" value="Effacer" />';
}
if(document.getElementById('cat').value == "livre")
{
document.getElementById('formulaire').innerHTML = "";
document.getElementById('formulaire').innerHTML = document.getElementById('formulaire').innerHTML + '<fieldset><legend>Critères</legend><label for="titre">Titre : </label><input type="text" id="titre" size="30" maxlength="30" /><br/><label for="auteur">Auteur : </label><input type="text" id="auteur" size="30" maxlength="30"/><br/><label for="critique">Critique : </label><textarea id="critique" cols="30" rows="4" ></textarea></fieldset>';
document.getElementById('boutons').innerHTML = "";
document.getElementById('boutons').innerHTML = document.getElementById('boutons').innerHTML + '<input type="submit" name="ajout" value="Ajouter" /><input type="reset" name="reset" value="Effacer" />';
}
}
</script>
</head>
<body>
<h1>Ajout</h1>
<form id="ajout" action="ajout.php" method="post">
<fieldset>
<legend>Catégorie</legend>
<p>
<select id="cat" onchange="genereForm();" >
<option disabled="disabled" selected="selected">Choisissez une catégorie</option>
<option value="film">Film</option>
<option value="jeu">Jeu vidéo</option>
<option value="livre">Livre</option>
</select>
</p>
</fieldset>
<div id="formulaire">
</div>
<div id="boutons">
</div>
</form>
</body>
</html> |
Dans cette page, le but est de générer un formulaire selon le choix qu'effectue l'utilisateur dans le menu déroulant.
L'utilisateur remplit ensuite le nouveau formulaire et clique sur ajouter pour ajouter les infos à la base de données
Le problème est que les formulaires se génèrent correctement, mais je ne parviens pas à récuperer les données qui sont ensuite entrées dans ce nouveau formulaire.
D'après MySQL, il y a un problème avec les variables $_POST['titre'], $_POST['auteur'] et $_POST['critique'].
Je voudrais donc savoir si cela provient d'une erreur dans la façon de générer mes formulaires ou si c'est autre chose.
Je précise que pour l'instant je début en javascript.
Merci d'avance de vos réponses
Adrilo
