Bonjour à tous.
Je me suis récement mis au JavaScript, et plus précisément à jQuery.
Je rencontre quelques soucis pour la validation d'un formulaire.
Voici le contexte :
J'ai une page contenant deux formulaires :
- un contenant un champ "hidden" et une textarea
- le deuxième ne contenant qu'un champ "hidden"
J'ai également deux boutons permettant d'afficher/cacher l'un ou l'autre avec des effets jQuery.
Jusque là, tout va bien.
Par contre, j'ai une fonction "générique" permettant de valider tous les formulaires du site.
Sur les pages ne contenant qu'un seul formulaire, il n'y a pas de problème : ça marche impec.
Mais sur la page contenant les deux formulaires, la validation du deuxième (celui ne contenant qu'un champ "hidden") va également chercher la valeur de la textarea du premier formulaire (et comme c'est un champ requis, et qu'il est vide, l'envoi des données ne peut pas se faire).
Voici une page toute simple, avec deux formulaires, faisant apparaitre le problème :
Code HTML :
<!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" xml:lang="fr" lang="fr" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script type="text/javascript" src="jquery/jquery-1.3_compressed.js"></script>
<script type="text/javascript">
function validateForm(form_id){
var dbg_vars=$('#'+form_id+' input, textarea').serialize();
alert(dbg_vars);
}
</script>
<title>Test Page</title>
</head>
<body>
<form id="form1" name="form1" action="">
<fieldset>
<legend>Formulaire No1</legend>
<input type="hidden" name="hidden_field_1" id="hidden_field_1" value="01" />
<textarea id="zone_texte1" name="zone_texte1"></textarea><br />
<br />
<input type="button" name="btn1" id="btn1" value="Valider le formulaire 1" onclick="validateForm('form1');" />
</fieldset>
<br />
</form>
<br />
<form id="form2" name="form2" action="">
<fieldset>
<legend>Formulaire No2</legend>
<input type="hidden" name="hidden_field_2" id="hidden_field_2" value="02" />
<input type="button" name="btn2" id="btn2" value="Valider le formulaire 2" onclick="validateForm('form2');" />
</fieldset>
<br />
</form>
</body>
</html>
Cette page ne fait qu'afficher les données du formulaire vérifié, mais on voit qu'en validant le deuxième formulaire, la textarea est sélectionnée.
Il y a sans doute quelquechose que je ne vois pas, mais justement, je ne le vois pas...
Merci d'avance pour vos éclaircissements.
@+
Xav'