validar formulario error

soldierjesus · #1 (**permalink**) 22/08/2009, 08:51

hola como estan necesitaba validar este formualrio utilize varios ejemplos pero no me da
-validar campos vacios
-validar que se escriba bien el mail del remitente
gracias por la ayuda este es el code:

Cita:

<!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">
<head>
<script language="JavaScript">

<html>
<head>
<script language="JavaScript">
+
function noVacio() {
var i;
var n = parseInt(document.form1.cantidad.value);
var bError = false;

for (i = 0; i < n; i++){
bError = bError || (eval("document.form1.elemento" + i + ".value == ''"));
if (bError){
alert("Campo inválido");
eval("document.form1.elemento" + i + ".focus()");
break;
}
}
if (!bError) alert("Ok");
}

function validar_email() {
if (document.form1.EMAIL.mail.indexOf('@') == -1)
alert ("Debes colocar una \"Dirección de Email\" válida");
document.form1.EMAIL.focus() //Esto recorna el cursor al campo "Email"
else {
document.form1.submit();
}
}
</script>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>::Formulario de contacto::</title>
</head>

<body>

<p><br>
<br>
</p>
<form name="form1" id="fom1" action="mail.php" method="post">
<table width="218">
<tr>
<td>Nombre</td>
<td><input name = "nombre" type = "text" id="nombre" /></td>
</tr>
<tr>
<td>Tu Email</td>
<td><label>
<input type="text" name="mail" id="mail" />
</label></td>
</tr>
<tr>
<td>Area</td>
<td><select name="areas" id"areas">
<option action ="0" >-seleccione destino-</option>
<option action ="1" >Consolidacion</option>
<option action ="2">Grupos de Paz</option>
<option action ="3">Escuelas</option>
<option action ="4">Evangelismo</option>
</select></td>
</tr>
<tr>
<td>Mensaje</td>
<td><textarea name="mensaje" cols="17" rows="4" id="areas"></textarea></td>
</tr>
<tr>
<td> </td>
<td><input type = "submit" name = "enviar" value = "Enviar mensaje" onclick="novacio()"" /></td>
</tr>
</table>
</FORM>
</body>
</html>

raul_romero · #2 (**permalink**) 22/08/2009, 09:42

Hola amigo, revise el codigo que tienes y encontre varios errores. Aqui te lo mando corregido para que lo compares.

Hay varios errores, y por eso no los puedo indicar todos, simplemente compara.

Código Javascript:

Ver original<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>::Formulario de contacto::</title>
<script language="JavaScript"> 
 
function noVacio() { 
var i; 
//var n = parseInt(document.form1.cantidad.value);  Esto es un error grave, pues en tu formulario no existe el campo cantidad.
var n = document.form1.elements.length;
var bError = false; 
 
for (i = 0; i < n; i++){ 
    bError = bError || (eval("document.form1.elements[" + i + "].value == ''")); 
    if (bError){
        alert("Campo inválido: "+document.form1.elements[i].name); 
        eval("document.form1.elements[" + i + "].focus()");
        return false;
        break;
        } 
} 
if (!bError) 
    {
    alert("Ok");
    return true;
    }
}
 
function validar_email() { 
if (document.form1.mail.indexOf('@') == -1) 
    {
    alert ("Debes colocar una \"Dirección de Email\" válida"); 
    document.form1.mail.focus() //Esto recorna el cursor al campo "Email" 
    }
    else { 
    document.form1.submit(); 
    } 
} 
</script> 
 
 
</head>
 
<body>
 
<p><br>
<br>
</p>
<form name="form1" id="fom1" action="mail.php" method="post">
<table width="218">
<tr>
<td>Nombre</td>
<td><input name = "nombre" type="text" id="nombre" /></td>
</tr>
<tr>
<td>Tu Email</td>
<td><label>
<input type="text" name="mail" id="mail" />
</label></td>
</tr>
<tr>
<td>Area</td>
<td><select name="areas" id"areas">
<option value="" >-seleccione destino-</option>
<option value="1" >Consolidacion</option>
<option value="2">Grupos de Paz</option>
<option value="3">Escuelas</option>
<option value="4">Evangelismo</option>
</select></td>
</tr>
<tr>
<td>Mensaje</td>
<td><textarea name="mensaje" cols="17" rows="4" id="areas"></textarea></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type = "submit" name = "enviar" value = "Enviar mensaje" onclick="return noVacio()" /></td>
</tr>
</table>
</form>
</body>
</html>

Espero que con esto, puedas comprender mejor la programación con JavaScript.

Saludos

soldierjesus · #3 (**permalink**) 22/08/2009, 09:58

realice los cambios y no me funciona aun

saludso

soldierjesus · #4 (**permalink**) 22/08/2009, 10:15

hermano tenia tantos errores que a la final funciono

graciassssssssssss

diego1311 · #5 (**permalink**) 22/08/2009, 10:23

Hola , raul romero tiuene razon.. aca te dejo otro codigo para que veas qeue tambien te alerta de que olvidas el @

Código PHP:

  <!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"> 
<head> 
<script language="JavaScript">  
var bError = false;  
function validar_email()  
{  
    if (document.form1.mail.value.indexOf('@')==-1)  
    { 
        alert ("Debes colocar una \"Dirección de Email\" válida");  
        bError=true; 
        document.form1.mail.focus()          
    } 
    else 
        bError=false; 
}  
 
function noVacio()  
{  
    var i;  
    n=(document.forms[0].elements.length-1); 
     
    for (i=0;i<n;i++) 
    {  
        if (!document.forms[0].elements[i].value) 
        {  
            alert("Campo inválido");  
            document.forms[0].elements[i].focus();  
            bError=true; 
            break;  
        }  
        else 
            bError=false; 
    }  
     
    if ((document.form1.mail.value)&&(!bError)) 
        validar_email(); 
      
    if (!bError)  
    { 
        alert("Ok, ahora si puedes submitar este formulario"); 
        document.form1.submit(); 
    } 
} 
 
</script>  
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>::Formulario de contacto::</title> 
</head> 
<body> 
<form name="form1" id="fom1" action="mail.php" method="post"> 
<table width="218"> 
<tr> 
    <td>Nombre</td> 
    <td><input name = "nombre" type = "text" id="nombre" /></td> 
</tr> 
<tr> 
    <td>Tu Email</td> 
    <td><label> 
        <input type="text" name="mail" id="mail" /> 
        </label></td> 
</tr> 
<tr> 
    <td>Area</td> 
    <td><select name="areas" id"areas"> 
    <option>-seleccione destino-</option> 
    <option value ="1" >Consolidacion</option> 
    <option value ="2">Grupos de Paz</option> 
    <option value ="3">Escuelas</option>     
    <option value ="4">Evangelismo</option> 
    </select></td> 
</tr> 
<tr> 
    <td>Mensaje</td> 
    <td><textarea name="mensaje" cols="17" rows="4" id="mensaje"></textarea></td> 
    </tr> 
<tr> 
    <td>&nbsp;</td> 
    <td><input type="button" name="enviar" id="enviar" value="Enviar mensaje" onclick="noVacio()"/></td> 
</tr> 
</table> 
</FORM> 
</body> 
</html>

soldierjesus · #6 (**permalink**) 22/08/2009, 10:29

mi pregunta ahora es como implemento las 2 funciones en el submit

onclick="return noVacio(),validar_email()"???

diego1311 · #7 (**permalink**) 22/08/2009, 10:35

pues ya te di el codigo, el codigo que te mande valida tanto si los campos estan vacios como si estas olvidando el @, copia y pega y veras XD
Saludos desde Lima-Perú

soldierjesus · #8 (**permalink**) 22/08/2009, 16:00

ok gracias hermano saludos