Bonsoir a tous,

Je galere sur un script de validation de formulaire en javascript.
Il fonctionne si je mets un alert a la ligne 57 de mon code js mais jne m'aime pas les alerts et je voudrais avoir les messages d'erreur dans ma div "error".
Quelqu'un peut-il m'aider svp?

<div id="error"></div>
<form id="form_userlogin" action="Session.php" method="post" onsubmit="return validate()";>  
		<table>
			<caption>Login</caption>	
				<tr>
				<td><label for="user_login">Login</label></td>
				<td><span class="mandatory_star">*</span></td>
				<td><input id="user_login" name="user_login" type="text" size="25" value=""/></td>
				</tr>
				
				<tr>
				<td><label for="user_password">Password</label></td>
    			<td><span class="mandatory_star">*</span></td>
    			<td><input id="user_password" name="user_password" type="password" size="25" value=""/></td>
				</tr>
				
				<tr>
				<td></td>
				<td></td>
				<td><input id="button_userlogin" name="button_userlogin" type="submit" value="Enter"/></td>
				</tr>
				
		</table>		
		
	</form>

function validate()

{
 var user_login 	= document.getElementById('user_login').value;
 var user_password	= document.getElementById('user_password').value;
 var errors =[];
 var ErrorMsg = document.getElementById('error');





 if (!check_length(user_login)) 
 {
  errors[errors.length] = "You must enter a login.";
 }

 if (!check_length(user_password)) 
 {
  errors[errors.length] = "You must enter a password.";
 }

 if (errors.length > 0) 
 {
  report_errors(errors);
  return false;
 }

 return true;
}



function check_length(text, min, max)
{
 min = min || 1;
 max = max || 100;

 if (text.length < min || text.length > max)
 {
  return false;
 }
 
 return true;
}



function report_errors(errors) 
{
 var msg = "ERROR\n";
 var numError;
 for (var i = 0; i<errors.length; i++) {
  numError = i + 1;
  msg += "\n" + numError + ". " + errors[i];
 }
ErrorMsg.innerHTML = msg;
}

D'où sort le ErrorMsg à la dernière ligne de ton script JS ? Si tu sais pas non plus, essaie de remplacer cette dernière ligne par document.getElementById("error").innerHTML = msg;

EDIT : Je viens de voir qu'il était plus haut, dans l'autre fonction... Donc comme je dis plus haut, essaie de le remplacer.

P.S. : je te donne rapidement de tuto : Aligner ses formulaires sans tableaux. C'est sémantiquement plus "propre" que faire un tableau pour ton formulaire

Le ErrorMsg est defini a la ligne 7 du code js.
D'ou mon incompréhension. Si c'est déclaré ça devrait fonctionner non?

Ah ah ... Je le savais que j'allais me faire reprendre sur les tableaux ... Oups ... J'avoue que c'est pas propre. Merci pour le tuto, je vais y jeter un coup d'oeil.

----------------------------------------------------------------
EDIT:

document.getElementById('error').innerHTML = msg; (avec des guillemets simples)
fonctionne. Merci beaucoup.

Quelqu'un peut-il m'expliquer pourquoi cela ne fonctionnait pas avant ... je ne comprends pas bien pourquoi la ...
----------------------------------------------------------------

Ta variable ErrorMsg était initialisée dans la fonction validate() et non dans la fonction report_errors(), donc évidemment il ne trouvait pas ton div.

Effectivement ça parait plus logique. Merci pour cette réponse. Je ferai plus attention a l'avenir quand je déclare mes variables.

Dernière question: une idée de pourquoi mon message d'erreur n'affiche pas les différents messages en allant a la ligne a chaque fois? Je pensais que le "\n" signifiait le passage a la ligne en js ... Pour le moment tout s'affiche sur la même ligne.

Alors attention : \n aurait fait un retour à la ligne dans un fichier, dans une boîte de dialogue... Mais pas dans l'interprétation d'un code HTML. Si tu veux des retours à la ligne, utilise <br />.

Pour précision, "\n" n'est pas propre au javascript, il est reconnu directement par les "systèmes" et signifie donc "ici il y a un retour à la ligne". Quand tu ouvres un fichier HTML avec ton éditeur, tu as plein de retours à la ligne (ce sont les \n) qui ne s'affichent pas dans ta page web. Ce sont véritablement les <br /> qui permettent ces retours à la ligne.