mensajes de validación

jhz1983 · #1 (**permalink**) 01/05/2011, 14:12

buenas alguien sabe como puedo hacer para imprimir un mensaje de error al lado del input que le corresponde.. o como deberia hacerlo .. lo primero que se me ocurrio fue esto.. pero no funciona .. luego pense en poner un <P style="hidden"> con el mensaje de error y cambiar el estilo si se producia el error peró no tengo muy claro si es la mejor forma de hacerlo.

Código:

<html>
	<head>
		<title>
			validacion - formularios
		</title>
	<script language="javascript">
	<!--
	function validar()
		{
		if(document.forms.formulario.nombre.value=="")
			{
			var error="Este campo no puede estar vacio";
			}

		}


	//-->>
	</script>
	</head>
<body>
	<h2>datos personales<h2>
	<form name="formulario" method="post" onSubmit="return validar()">
	<input name="nombre" id="nombre" type="text">
								<script language="javascript">
								<!--
								document.write(error);
								//-->>
								</script>
	<input type="submit" value="enviar">
	</form>
</body>

IsaBelM · #2 (**permalink**) 01/05/2011, 14:19

a mí la opción del bloque me parece acertada. solo que yo usaría span, también tiene algún inconveniente, pero bueno

alexg88 · #3 (**permalink**) 01/05/2011, 16:27

El primero no te funcionaba porque el concepto no está bien.

El document.write que pones se ejecuta la primera vez que entras a la página web,
no cuando envias el formulario. Si lo que quieres es cambiar el html, tienes que utilizar las funciones javascript para el manejo del DOM.

Lo puedes hacer con javascript normal o utilizar un framework javascript como
JQuery: http://jquery.com/

Ejemplo en vivo en esta página: http://jsfiddle.net/alexg88/c2hYr/

y aquí:

Código HTML:

Ver original<html>
    <head>
        <title>
            validacion - formularios
        </title>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.js" />
    <script language="javascript">  
        $("form[name='formulario']").submit(function(){
 
 if($("#nombre").val()=="")  
 {
     $('#nombre').after('<span class="error">Este campo no puede estar vacio</span>');    
    return false;
 }
});
    
    </script>
    </head>
<body>
    <h2>datos personales<h2>
    <form name="formulario" method="post">
    <input name="nombre" id="nombre" type="text">                               
    <input type="submit" value="enviar">
    </form>
</body>
</html>

Espero que te sirva

fodsite · #4 (**permalink**) 01/05/2011, 17:16

Te recomiendo que uses el plugin de jQuery jquery.validate.js, es sencillo de usar. Te dejo el link directamente con los ejemplos, espero te sirva.

http://jquery.bassistance.de/validate/demo/

kanalejana · #5 (**permalink**) 19/05/2011, 05:41

Cita:

Iniciado por fodsite

Te recomiendo que uses el plugin de jQuery jquery.validate.js, es sencillo de usar. Te dejo el link directamente con los ejemplos, espero te sirva.

http://jquery.bassistance.de/validate/demo/

A mi ese tutorial lo único que ha hecho es hacerme perder el tiempo, pero encontre este otro: http://corpocrat.com/2009/07/15/quick-easy-form-validation-tutorial-with-jquery/ con el que si que e logrado hacer las validaciones. Ahora lo que me falta es cambiar el: Please enter at least 5 characters. o This field is required. al castellano.
Si alguien lo sabe que me busque y me lo diga

Saludos \o/

InKarC · #6 (**permalink**) 19/05/2011, 07:47

Es pasandole los mensajes al invocarlo, asi:

Código Javascript:

Ver originalvar validator = $("#signupform").validate({ 
        rules: { 
            nombre: "required"
        },
        messages:{
            nombre: "Olvido escribir su nombre"
        }
})

Y ese link (http://jquery.bassistance.de/validate/demo/) junto los ejemplos que tiene abajo son los mejores tutos sobre el plugin; esto lo aprendí fue hay.

kanalejana · #7 (**permalink**) 19/05/2011, 10:04

ya lo se :( pero no consegui sacar nada en claro, se que lo que uso ahora no es ninguna maravilla, pero weno... para salir del paso me vale que lo necesito para ayer :/
Era por ayudar...

Aijoona · #8 (**permalink**) 19/05/2011, 10:09

Uds piensan que incluir una librería como jQuery solo para validar un formulario tiene sentido?

SarahCrewe · #9 (**permalink**) 19/05/2011, 12:46

En header:

Cita:

En funciones.js

Cita:

En el archivo .php / .html

Cita:

<form name="iniciar_sesion" method="post" action="validar_inicio_sesion.php">

Usuario:<input type="text" name="usuario" /> <div id="notice_usuario" class="notice"> </div>

Contraseña:<input type="password" name="pass" /> <div id="notice_password" class="notice"> </div>

<input type='button' name='Iniciar_sesion' value='Iniciar sesion' onClick="validar_inicio_sesion(this.form)" />
</form>

Espero te sirva!

IsaBelM · #10 (**permalink**) 19/05/2011, 13:31

me sorprende observar como la gente se afana en responder a un tema en el que el propio interesado no ha dado señal, de ningún tipo, desde hace casi 20 días