Validar elementos obligatorios en formulario

sandrukymp · #1 (**permalink**) 20/03/2010, 07:24

Muy buenas a todos,

espero que me podáis ayudar.

Mi problema es que necesito validar un formulario para que determinados campos como nombre, dirección, teléfono, email y, sobre todo, la casilla de verificación de "acepto los términos y condiciones" sean obligatorios.

Tengo conocimientos de html y css, pero muy poco de javascript y por eso me está siendo muy difícil conseguir mi objetivo. El problema adicional es que tengo un Captcha en la página para evitar las decenas de spam que me llegaban cada día, y al tener diversos scripts en la página no soy capaz de hacer lo que me propongo.

Con Dreamweaver conseguí validar los campos de texto, pero no así el campo de verificación, en mi caso el más importante, y solo conseguí tener más scripts complicados (pues así me parecen los generados por Dreamweaver automáticamente) y no mi objetivo de validar la casilla de verificación.

Os dejo código html del formulario por si alguien me puede echar una mano:

<FORM NAME="miforma" ACTION="http://www.cerospam.com.ar/form.php" METHOD="post">
<p>
<INPUT NAME="subject" VALUE="Anmeldung" TYPE="hidden">
<INPUT NAME="redirect" VALUE="http://www.anda-sprachschule.de/es/gracias.html" TYPE="hidden">

Nombre y apellido:<BR>
<INPUT NAME="Name" SIZE="25" CLASS="rahmen" TYPE="text">
<BR>
<BR>
Género:<BR>
<INPUT NAME="Geschlecht" VALUE="hombre" TYPE="radio">
Hombre
<INPUT NAME="Geschlecht" VALUE="mujer" TYPE="radio">
Mujer<BR>
<BR>
Fecha de nacimiento:<BR>
<INPUT NAME="Name" SIZE="25" CLASS="rahmen" TYPE="text">
<BR>
Dirección:<BR>
<INPUT NAME="Adresse" SIZE="25" CLASS="rahmen" TYPE="text">
<BR>
Código postal, localidad:<BR>
<INPUT NAME="Plz, Ort" SIZE="25" CLASS="rahmen" TYPE="text">
<BR>
Teléfono:<BR>
<INPUT NAME="Telefon" SIZE="25" CLASS="rahmen" TYPE="text">
<BR>
Email:<BR>
<INPUT NAME="Email" SIZE="25" CLASS="rahmen" TYPE="text">
<BR>
Comentarios:<BR>
<TEXTAREA NAME="Kommentar" CLASS="rahmen">
</TEXTAREA>
<BR>
</p>
<p>
<input name="condiciones" type="checkbox" class="rahmen" id="condiciones" value="Si">
<strong>Acepto los <A HREF="condiciones.html">términos y condiciones</A></strong></p>
<p> <BR>
Por favor introduzca el código:<BR>
<INPUT TYPE="text" SIZE="25" NAME="cerospam_code" VALUE="">
<BR>
<BR>
<SCRIPT TYPE="text/javascript">

</SCRIPT>
<SCRIPT TYPE="text/javascript" SRC="http://www.cerospam.com.ar/captcha.php">
</SCRIPT>
<BR>
<BR>
<INPUT VALUE="Enviar" CLASS="rahmen" TYPE="submit">
<INPUT VALUE="Borrar" CLASS="rahmen" TYPE="reset">
<BR>
<BR>
</p>
</FORM>

Muchas gracias de antemano y de todo corazón,

S.

Adler · #2 (**permalink**) 20/03/2010, 09:12

Hola

Prueba así

Cita:

Código Javascript:

Ver originalfunction validar_campos(a) {
var oktermns = a.condiciones.checked == true;
var okad= a.Adresse.value != "";
 
    if (!oktermns) {
        alert ("Has de aceptar las Condiciones de Uso")
        return (false);
     }
    
 
    if (!okad) {
        alert ("Has de rellenar el campo");
        return (false);
    }
 
// siguiente validación
 
 
else
        return (true);
}

Suerte

sandrukymp · #3 (**permalink**) 20/03/2010, 10:46

Fantástico, muchas gracias, la validación de la casilla de verificación funciona perfectamente.

Ahora mi duda está en como validar con este script los campos de texto...

Si en el script:
{
var oktermns = a.condiciones.checked == true;
var okad= a.Adresse.value != "";

if (!oktermns) {
alert ("Por favor, acepte los términos y condiciones")
return (false);
}

if (!okad) {
alert ("Has de rellenar el campo");
return (false);
}

else
return (true);
}

a.condiciones.checked es para la casilla de verificación, ¿cómo funciona para los campos de texto?¿es exactamente igual o tengo que variar .checked?

¡Muchísimas gracias otra vez!

sandrukymp · #4 (**permalink**) 20/03/2010, 10:51

Perdón, no me he explicado con claridad.

Ahora lo veo muy claro en la función.

La pregunta es si debo denominar a todas las variables okad:

function validar_campos(a) {
var oktermns = a.AGB.checked == true;
var okad= a.Name.value != "";
var okad= a.Adresse.value != "";
var okad= a.Plz, Ort.value != "";
var okad= a.Telefon.value != "";
var okad= a.Email.value != "";

o debo cambiar el nombre...

¡Muchas gracias!

sandrukymp · #5 (**permalink**) 20/03/2010, 10:57

Yo lo he hecho así:

function validar_campos(a) {
var oktermns = a.AGB.checked == true;
var oknm= a.Name.value != "";
var okad= a.Adresse.value != "";
var okplz= a.Plz, Ort.value != "";
var oktlf= a.Telefon.value != "";
var okem= a.Email.value != "";

if (!oktermns) {
alert ("Por favor, acepte los términos y condiciones")
return (false);
}

if (!oknm) {
alert ("Debe completar el nombre");
return (false);

}
if (!okad) {
alert ("Debe completar la dirección");
return (false);
}

if (!okplz) {
alert ("Debe completar el código postal y la ciudad");
return (false);
}

if (!oktlf) {
alert ("Debe completar el teléfono");
return (false);
}

if (!okem) {
alert ("Debe completar el email");
return (false);
}

else
return (true);
}

Y no me ha funcionado. ¿Dónde está el error/los errores?

Como siempre, muchas gracias

sandrukymp · #6 (**permalink**) 20/03/2010, 11:09

Ya lo he arreglado, el problema estaba en:

var okplz= a.Plz, Ort.value != "";

he cambiado el nombre del campo en el formulario y todo funciona.

Mil gracias, podemos dar el tema por cerrado!