Problème avec le bouton 'submit'.

27 avr. 2013, 14:20

Bonjour,

Je suis un amateur en php & je suis entraîne de faire un programme qui permettra d'aller dans un jeux par connexion. Le problème s'est que lorsque je clique sur le bouton submit, c'était censer faire devenir l'élément 'alerta' visible. Au lieu de ça, l'element 'alerta' devient visible & rapidment, il devient hidden. Que faire pour que ça reste visible en permanent?

<?php
 define('login','william');
 define('mdp','abc123');
 $mensaje = '';

 if(empty($_POST['nombre']))
 {
	$mensaje = 'Llena el formulario.';
 }
 elseif(empty($_POST['mdp']))
 {
	$mensaje = 'Pon tu contrasena';
 }
 elseif(empty($_POST['mdp']) && empty($_POST['nombre']))
 {
	$mensaje = 'Llena el formulario';
 }
 elseif($_POST['nombre'] !== login || $_POST['mdp'] !== mdp)
 {
	$mensaje = 'Tu nombre o tu contresena es malo';
 }
 elseif($_POST['nombre'] !== login && $_POST['mdp'] !== mdp)
 {
	$mensaje = 'Tu nombre o tu contresena es malo';
 }
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>juego.php - conectate ahora.</title>
</head>
<style type="text/css">
body
{
 background-color:#00FFA2;
 font-family:tahoma;
}

#pagina
{
 background-color:#DBFFF2;
 width:340px;
 position:relative;
 top:250px;
}

#conexion
{
 border:1px solid #00AB6D;
 background-color:#00D486;
 font-family:tahoma;
 color:#B3FFE3;
}

#alerta
{
 border:1px solid black;
 background-color:red;
 font-size:13px;
 visibility:hidden;
}
</style>
<body>
<center>
<div id="pagina">
<br>
<form name="formulario" method="post">
<span id="alerta"><?php echo $mensaje; ?></span><br>
Nombre : <input type="text" name="nombre" id="nombre"><br>
Contrasena : <input type="password" name="mdp" id="mdp"><br>
<input type="submit" value="conectarse" id="conexion" name="conexion" onclick="document.getElementById('alerta').style.visibility = 'visible'"><br>
</form>
<br>
</div>
</center>
</body>
</html>

27 avr. 2013, 17:44

Dans ton bouton enlève type = submit de ce fait le formulaire ne sera pas soumis et l'action dans ton onclick sera exécuté.

27 avr. 2013, 23:33

Bonjour,

désolé benv8nam mais je crois que djun souhaite avoir le message d'erreur, donc il lui faut la validation du formulaire.

Je pense donc que la solution serait de supprimer la propriété "visibility:hidden;" du style d'"alerta" et ton évènement "onclick" sur le bouton.

Puis autour de ton span "alerta" tu mets ceci :

<?php if($mensaje != ''): ?><span id="alerta"><?php echo $mensaje; ?></span><br><?php endif; ?>

Comme ça ton message d'alerte s'affichera seulement en cas d'erreur (si j'ai bien compris

)

01 mai 2013, 00:46

Bonjour,

désolé benv8nam mais je crois que djun souhaite avoir le message d'erreur, donc il lui faut la validation du formulaire.

Je pense donc que la solution serait de supprimer la propriété "visibility:hidden;" du style d'"alerta" et ton évènement "onclick" sur le bouton.

Puis autour de ton span "alerta" tu mets ceci :
<?php if($mensaje != ''): ?><span id="alerta"><?php echo $mensaje; ?></span><br><?php endif; ?>
Comme ça ton message d'alerte s'affichera seulement en cas d'erreur (si j'ai bien compris )

Ca ne marche pas. Alors, j'ai décidé de traiter mes erreurs avec javascript. Mais, ca ne marche pas.

[javascript]<?php
define('login','william');
define('mdp','abc123');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>juego.php - conectate ahora.</title>
</head>
<script language="javascript">
function empty(e) {
switch(e) {
case "":
case 0:
case "0":
case null:
case false:
case typeof this == "undefined":
return true;
default : return false;
}
}

function detectarError()
{
var nombre = document.getElementById('nombre').value;
var mdp = document.getElementById('mdp').value;
var login = document.getElementById('mdp').value;
var contresena = document.getElementById('constmdp').value;
var mensaje = '';
if(empty(nombre) && empty(nombre))
{
document.getElementById('alerta').innerHTML="Llena el formulario";
}
if(empty(nombre) || empty(nombre))
{
document.getElementById('alerta').innerHTML="Llena el formulario";
}
if(nombre === login || mdp === contrasena)
{
document.getElementById('alerta').innerHTML="La combinacion es mala.";
}
if(nombre === login && mdp === contrasena)
{
document.getElementById('alerta').innerHTML="La combinacion es mala.";
}
}
</script>
<style type="text/css">
body
{
background-color:#00FFA2;
font-family:tahoma;
}

#pagina
{
background-color:#DBFFF2;
width:340px;
position:relative;
top:250px;
}

#conexion
{
border:1px solid #00AB6D;
background-color:#00D486;
font-family:tahoma;
color:#B3FFE3;
}

#alerta
{
border:1px solid black;
background-color:red;
font-size:13px;
}
</style>
<body>
<center>
<div id="pagina">
<br>
<input type="hidden" value="<?php echo login; ?>" id="constlogin">
<input type="hidden" value="<?php echo mdp; ?>" id="constmdp">
<span id="alerta"></span><br>
<form name="formulario" method="post">
Nombre : <input type="text" name="nombre" id="nombre"><br>
Contrasena : <input type="password" name="mdp" id="mdp"><br>
<a onclick='detectarError()'><input type="submit" value="conectarse" id="conexion" name="conexion"><br></a>
</form>
<br>
</div>
</center>
</body>
</html>[/javascript]

01 mai 2013, 15:46

Le problème de gérer tes erreurs de connexion avec le javascript c'est que ton login et mot de passe sont en claire dans le code de ta page ...

01 mai 2013, 16:11

Tiens voici ta solution un peu mieux expliquée.

j'ai fait un isset au début du code PHP pour savoir si on vient de cliquer sur le bouton de connexion ... en effet tant que tu n'as pas cliqué, la variable de formulaire portant le nom de ton bouton n'existe pas.

J'ai viré le visibility : hidden; de #alerta
J'ai ajouté action="<?php echo $_SERVER['PHP_SELF']; ?>" sur ta balise form, ce qui signifie que ton formulaire sera renvoyé sur la même page.
J'ai viré le onclick="document.getElementById('alerta').style.visibility = 'visible'" de ton bouton.

Ca fonctionne chez moi.

Mais ce n'est pas un problème de mise en forme, c'est un problème surtout de PHP

<?php
define('login','william');
define('mdp','abc123');
$mensaje = '';

if(isset($_POST['conexion']))
{
	if(empty($_POST['nombre']))
	{
	        $mensaje = 'Llena el formulario.';
	}
	elseif(empty($_POST['mdp']))
	{
	        $mensaje = 'Pon tu contrasena';
	}
	elseif(empty($_POST['mdp']) && empty($_POST['nombre']))
	{
	        $mensaje = 'Llena el formulario';
	}
	elseif($_POST['nombre'] !== login || $_POST['mdp'] !== mdp)
	{
	        $mensaje = 'Tu nombre o tu contresena es malo';
	}
	elseif($_POST['nombre'] !== login && $_POST['mdp'] !== mdp)
	{
	        $mensaje = 'Tu nombre o tu contresena es malo';
	}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
	<head>
		<title>juego.php - conectate ahora.</title>
		<style type="text/css">
		body
		{
		 background-color:#00FFA2;
		 font-family:tahoma;
		}
		
		#pagina
		{
		 background-color:#DBFFF2;
		 width:340px;
		 position:relative;
		 top:250px;
		}
		
		#conexion
		{
		 border:1px solid #00AB6D;
		 background-color:#00D486;
		 font-family:tahoma;
		 color:#B3FFE3;
		}
		
		#alerta
		{
		 border:1px solid black;
		 background-color:red;
		 font-size:13px;
		}
		</style>
	</head>
	<body>
		<center>
			<div id="pagina">
				<form name="formulario" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
					<span id="alerta"><?php echo $mensaje; ?></span><br>
					Nombre : <input type="text" name="nombre" id="nombre"><br>
					Contrasena : <input type="password" name="mdp" id="mdp"><br>
					<input type="submit" value="conectarse" id="conexion" name="conexion"><br>
				</form>
			</div>
		</center>
	</body>
</html>

04 mai 2013, 16:05

Merci beaucoup!

05 mai 2013, 03:25

De rien

Problème avec le bouton 'submit'.

Qui est en ligne