Autor Tema: JavaScript ejercicio evento onsubmit HTML placeholder en formulario CU01142E# (Leído 2947 veces)

Pepote21 · « **en:** 20 de Mayo 2017, 09:39 »

Hola a todos. Os paso mi código para el ejercicio CU01142E del tutorial de programación web como si estuviera en primero con JavaScript. Gracias

Un saludo

Código: [Seleccionar]

<!DOCTYPE html>
<html>
    <head>
        <title>Ejercicio  tutorialesprogramacionya.com</title>
        <meta charset="utf-8">
        <style type="text/css">
            body {background-color:pink; font-family: sans-serif;}
            label {color: maroon; display:block; padding:5px;}
        </style>
        <script type="text/javascript"> 
		    var msg='';
            function validar(){
                var nombre=document.getElementById('nombre').value;
				var email=document.getElementById('email').value;
				
				comprobarNombre(nombre);
				email=transformarEmailAMinusculas(email);
				email=rectificarAtEnEmail(email);
				comprobarEmail(email);
				
			    document.getElementById('email').value=email;
            }			
            function comprobarNombre(nombre){
			    if(nombre.length<3){
				    msg='El nombre no cumple tener al menos tres letras';alert(msg);
				}else{}	
			}
			function comprobarEmail(email){
			    var arroba=false;
				var punto=false;
			    for(var i=0;i<email.length;i++){
	                if(email.charAt(i)=='@'){arroba=true;}
	                if(email.charAt(i)=='.'){punto=true;}
	            }
				if(arroba==false && punto==false){
					msg='Faltan los símbolos \'@\' y el \'.\'';alert(msg);
				}else{
					if(arroba==false){msg='Falta el símbolo \'@\' en el correo electrónico';alert(msg);}
					if(punto==false){msg='Falta el símbolo \'.\' en el correo electrónico';alert(msg);}
				}
			}
			function transformarEmailAMinusculas(email){
			    return email.toLowerCase();
			}
			function rectificarAtEnEmail(email){
                return email.replace(/at/g,'@');
            }		
			
        </script>
    </head>
    <body>
	    <script type="text/javascript">    
           
        </script> 
       	<div style="width:450px;">
            <form name ="formularioContacto" class="formularioTipo1" method="get" action="https://www.aprenderaprogramar.com" onsubmit="validar()">
                <p>Si quieres contactar con nosotros envíanos este formulario relleno:</p>
                <label for="nombre"><span>Nombre:</span> <input id="nombre" type="text" name="nombre" placeholder="Introduzca su nombre" size="60"/></label>
                <label for="apellidos"><span>Apellidos:</span> <input id="apellidos" type="text" name="apellidos" placeholder="Introduzca sus apellidos" size="60"/></label>
                <label for="email"><span>Correo electrónico:</span> <input id="email" type="text" name="email" placeholder="Introduzca su correo electrónico" size=60px/></label>
                <label>
				    <input type="submit" value="Enviar" >
                    <input type="reset" value="Cancelar">
                </label>
            </form>
        </div>
		
		
    </body>
</html>

Ogramar · « **Respuesta #1 en:** 16 de Junio 2017, 19:55 »

Buenas Pepote21

Como en otros hilos sobre este ejercicio, veo bien el código con un problema, es que si se encuentra un fallo además de mostrarse el mensaje de advertencia no se envíe el formulario pero esto se explica más adelante en el curso. Relacionado con esto está que si se muestra un mensaje de fallo al enviarse el formulario desaparecen los datos que había (al haberse enviado el formulario).

Como todo esto se explica más adelante en el curso y el código está bien planteado y bien estructurado en funciones ¡Todo bien!

Salu2

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: