Bonjour à tous,
Je suis en train de faire une petite application html qui référence les livres d'une bibliothèque privée. J'ai une page "référence des livres" qui se compose de champs de saisie texte (titre, auteur, etc...) et de boutons radio pour choisir le genre du livre. Je voudrais vérifier à l'aide de JavaScript si l'utilisateur a bien rempli les champs de saisie et coché l'un des boutons radio avant de valider mon formulaire.
Pour la vérification des champs de saisie, je n'ai pas de problème. Par contre, je n'arrive pas à faire tester mes boutons radio par JavaScript. Cela fait 3 jours entiers que je cherche sur Internet et que j'essaie de faire tous les codes possibles et imaginables, et rien ne fonctionne jamais sur mes boutons radio.
Je vous soumets donc mon code, si quelqu'un pouvait me dire ce qui ne va pas :
Un très grand merci pour votre aide.
Modifié par sam06 (03 Jun 2011 - 10:41)
Je suis en train de faire une petite application html qui référence les livres d'une bibliothèque privée. J'ai une page "référence des livres" qui se compose de champs de saisie texte (titre, auteur, etc...) et de boutons radio pour choisir le genre du livre. Je voudrais vérifier à l'aide de JavaScript si l'utilisateur a bien rempli les champs de saisie et coché l'un des boutons radio avant de valider mon formulaire.
Pour la vérification des champs de saisie, je n'ai pas de problème. Par contre, je n'arrive pas à faire tester mes boutons radio par JavaScript. Cela fait 3 jours entiers que je cherche sur Internet et que j'essaie de faire tous les codes possibles et imaginables, et rien ne fonctionne jamais sur mes boutons radio.
Je vous soumets donc mon code, si quelqu'un pouvait me dire ce qui ne va pas :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Page enregistrement</title>
<link rel="stylesheet" type="text/css" href="./styles.css">
<!--Teste les champs de saisie texte :-->
<script type="text/javascript" >
function test()
{
var ok=0;
if (document.formulaire1.titre.value=='')
{
document.formulaire1.titre.value=prompt('Veuillez remplir le champ "Titre" :');
ok=1;
}
if (document.formulaire1.auteur.value=='')
{
document.formulaire1.auteur.value=prompt('Veuillez remplir le champ "Auteur" :');
ok=1;
}
if (document.formulaire1.editeur.value=='')
{
document.formulaire1.editeur.value=prompt('Veuillez remplir le champ "Editeur" :');
ok=1;
}
if (document.formulaire1.genre.value=='')
{
document.formulaire1.genre.value=prompt('Veuillez remplir le champ "Genre" :');
ok=1;
}
if (ok==0)
{
return true;
}
else
{
return false;
}
}
</script>
<!--Teste les boutons radio :-->
<script type="text/javascript" >
function verifRadio()
{
document.getElementsByName("genre").!checked;
}
alert("Cocher les cases");
</script>
</head>
<body>
<div>
<form method="post" action="" name="formulaire1" onsubmit="return test();">
<table class="table_form" cellpadding="0" cellspacing="0">
<caption class="gros_titre">Nouveau livre</caption>
<!--Champs de saisie texte :-->
<tr>
<td>
<fieldset>
<legend class="texte_fieldset">Références du livre</legend>
<table border="0" cellpadding="0" cellspacing="10">
<tr>
<td class="legende"><label for="titre">Titre : </label></td>
<td><input name="titre" id="titre" type="text" size="40" class="champ"></td>
</tr>
<tr>
<td class="legende"><label for="auteur">Auteur : </label></td>
<td><input name="auteur" id="auteur" type="text" size="30" class="champ"></td>
</tr>
<tr>
<td class="legende"><label for="editeur">Éditeur : </label></td>
<td><input name="editeur" id="editeur" type="text" size="30" class="champ"></td>
</tr>
<tr>
<td height="5"> </td>
</tr>
<tr>
<td><input type="reset" name="reset" value=" Recommencer " class="bouton_simple"></td>
</tr>
</table>
</fieldset>
<!--Boutons radio :-->
<fieldset>
<legend class="texte_fieldset">Genre</legend>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<input type="radio" name="genre" id="roman" value="roman"><label for="roman" class="legende">Roman</label><br>
<input type="radio" name="genre" id="informatique" value="informatique"><label for="informatique" class="legende">Informatique</label><br>
<input type="radio" name="genre" id="sante" value="sante"><label for="sante" class="legende">Santé</label><br>
<input type="radio" name="genre" id="spiritualite" value="spiritualite"><label for="spiritualite" class="legende">Spiritualité</label><br>
<input type="radio" name="genre" id="cuisine" value="cuisine"><label for="cuisine" class="legende">Cuisine</label><br>
<input type="radio" name="genre" id="bricolage" value="bricolage"><label for="bricolage" class="bricolage">Bricolage</label><br>
<input type="radio" name="genre" id="nature" value="nature"><label for="nature" class="legende">Nature</label><br>
<input type="radio" name="genre" id="photo" value="photo"><label for="photo" class="legende">Photo</label><br>
<input type="radio" name="genre" id="bd" value="bd"><label for="bd" class="legende">Bande dessinée</label><br>
<a href="../projet/genre.html" style="text-decoration:none"><input type="radio" name="genre" id="autre" value="autre"><label for="autre" class="legende">Autre... </label></a ><span class="autre">(cliquez sur "Autre..." si le genre de votre livre ne figure pas dans cette liste)</span>
</td>
</tr>
</table>
</fieldset>
</td>
</tr>
<tr>
<td>
<input type="reset" name="reset" value=" Tout recommencer " class="bouton_simple2">
<input type="submit" name="submit" value=" Valider " class="bouton_simple" onclick="verifRadio();">
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
Un très grand merci pour votre aide.
Modifié par sam06 (03 Jun 2011 - 10:41)
