Input qui apparait sous une condition
Bonjour, je suis en cours de développement d'une interface de gestion de bibliothèque, dans le formulaire d'ajout de livre, je dispose d'une liste déroulante <select> qui s'alimente d'une table de base de données. j'aimerai bien, quand je séléctionne Autre, un champ de texte apparait, pour que je puisse saisir une autre valeur, j'ai testé ce script, mais sa n'a pas marché, je ne sais pas où se présente le problème, Merci pour votre aide.
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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ajout d'un nouveau livre</title>
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript">
function changementType() {
var type = document.getElementById("auteur").value;
if (type == "Autre") {
document.getElementById("autre").style="display:block";
} else {
document.getElementById("autre").style="display:none";
}
}
</script>
<link type="text/css" rel="stylesheet" href="style.css" />
</head>
<body>
<div id="conteneur">
<header>
<img src="images/banniere.jpg" title="Bienvenue" alt="Le logo devrait s'afficher ici"/>
<div id="head-bottom">
<form method="get" action="#">
<input type="text" id="search" name="search" placeholder="Search..."/> <input type="submit" value="Go !" class="bouton" />
</form>
</div>
</header>
<div id = "menugauche">
<h3>Navigation</h3>
<ul>
<li><a href="index.html">Acceuil</a></li>
<li><a href="inscription.html">Inscrivez vous</a></li>
<li><a href="reservation.php">Réserver un ouvrage</a></li>
<li><a href="apropos.html">À-propos de nous</a></li>
<li><a href="contact.html">Nous contacter</a></li>
</ul>
</div>
<div id = "menudroit">
<h3>Panneau d'administration</h3>
<ul>
<li><a href="adherents.php">Gestion des Adhérents</a></li>
<li><a href="ouvrages.php">Gestion des livres</a></li>
</ul>
</div>
<div id="corps">
<h2>Ajout d'un nouvel ouvrage</h2>
<p>
Prière de remplir ces champs :
</p>
<form method="post" action="ajoutOuvragePost.php">
<label for="isbn">ISBN :</label>
<br />
<input type="text" name="isbn" id="isbn" required="required" /><br />
<label for="titre">Titre :</label>
<br />
<input type="text" name="titre" id="titre"/><br />
<label for="numarr">Numéro d'arrivée :</label><br />
<input type="text" name="numarr" id="numarr" /><br />
<label for="nbexem">Nombre d'éxemplaires :</label>
<br />
<input type="text" name="nbexem" id="nbexem" required="required"/><br />
<label for="numarr">Cote :</label><br />
<input type="text" name="cote" id="cote" /><br />
<label for="auteur">Auteur :</label>
<br />
<select name="auteur" id="auteur" onchange="changementType();">
<?php
$con = mysql_connect("localhost","root","");
$db = mysql_select_db("gestion_bib");
$sql = "select * from auteur";
$req = mysql_query($sql);
while($res=mysql_fetch_assoc($req)){
echo"
<option value=".$res['id'].">".utf8_encode($res['nom'])."</option>
";
}
?>
<option value="Autre">Autre</option>
</select>
<div id="autre" style="display:none"><input type="text" name="auteurtxt"/> </div>
<br />
<label for="categorie">Catégorie :</label>
<br />
<select name="categorie" id="categorie">
<?php
$con = mysql_connect("localhost","root","");
$db = mysql_select_db("gestion_bib");
$sql = "select * from categorie";
$req = mysql_query($sql);
while($res=mysql_fetch_assoc($req)){
echo"
<option value=".$res['id'].">".utf8_encode($res['libelle'])."</option>
";
}
?>
</select><br />
<input type="submit" value="Valider" class="boutonform"/>
<input type="hidden" name="valeur" value="newOuvrage.php">
<input type="reset" value="Réinitialiser les champs" class="boutonform"/>
</form>
</div>
<footer>
<p>
Copyright © <a href="http://wwwensa.univ-oujda.ac.ma">ENSAO</a> 2012 | Tous droits réservés<br />
</p>
</footer>
</div>
</body>
</html> |
