Tema: Validar campo Correo Electronico y campos numericos
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 13/04/2013, 09:53
flashtrix
 
Fecha de Ingreso: noviembre-2004
Mensajes: 249
Antigüedad: 20 años
Puntos: 1
Validar campo Correo Electronico y campos numericos
Hola este Script lo tengo listo, me valida la información con cuadros alert cuando falta alguno por llenar y retorna al campo (focus) que hace falta..

El ejemplo me sirve es decir funciona....

Pero necesito:

1. Que en el campo correo verifique que en realidad se este escribiendo un correo osea que contenga la arroba @ y todo eso.

2. Ademas quiero que solo en los campos numeroidentificacion, edad y celular solo se puedan escribir números.

Acá pongo el script para que por favor me ayuden a modificarlo pues busco en otros tutoriales y agrego lineas de codigo pero al probarlo se me daña todo lo que ya llevaba

Código Javascript: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=3,Transition=4)">
  6. <title>Documento sin título</title>
  7. <script language="javascript">
  8. function valida_envia(){ 
  9. //valido el nombre 
  10.     if (document.fvalida.nombres.value.length==0){ 
  11.          alert("Tiene que ingresar su nombre completo") 
  12.          document.fvalida.nombres.focus() 
  13.          return 0; 
  14.     } 
  15. //valido el apellido
  16.     if (document.fvalida.apellidos.value.length==0){ 
  17.          alert("Tiene que ingresar su apellido completo") 
  18.          document.fvalida.apellidos.focus() 
  19.          return 0; 
  20.     } 
  21. //valido el tipo de identificacion
  22.         if (document.fvalida.tipo.value=='0'){ 
  23.          alert("Seleccione su tipo de identificación") 
  24.          document.fvalida.tipo.focus() 
  25.          return 0; 
  26.     } 
  27. //valido la identificacion
  28.         if (document.fvalida.numeroidentificacion.value.length==0){ 
  29.          alert("Ingrese su número de identificación") 
  30.          document.fvalida.numeroidentificacion.focus() 
  31.          return 0; 
  32.      }
  33. //valido el correo
  34. if (document.fvalida.correo.value.length==0){ 
  35.          alert("Ingrese su correo electronico") 
  36.          document.fvalida.correo.focus() 
  37.          return 0; 
  38.      }
  39. //valido la edad. tiene que ser entero mayor que 18 
  40. if (document.fvalida.edad.value.length==0){ 
  41.          alert("Ingrese su edad") 
  42.          document.fvalida.edad.focus() 
  43.          return 0; 
  44.      }  
  45. //valido la ocupacion 
  46. if (document.fvalida.ocupacion.value.length==0){ 
  47.          alert("Debe ingresar su ocupación, por ejemplo: si es docente, empleado, estudiante, desempleado, etc.") 
  48.          document.fvalida.ocupacion.focus() 
  49.          return 0; 
  50.     } 
  51. //valido celular 
  52. if (document.fvalida.celular.value.length==0){ 
  53.          alert("Ingrese su numero de celular o teléfonico") 
  54.          document.fvalida.celular.focus() 
  55.          return 0; 
  56.     } 
  57. //valido el lugar de residencia
  58. if (document.fvalida.residencia.value.length==0){ 
  59.          alert("Ingrese el lugar de residencia, por ejemplo: si es de Corozal, de un corregimiento de Corozal, etc.") 
  60.          document.fvalida.residencia.focus() 
  61.          return 0; 
  62.     } 
  63. //el formulario se envia 
  64.     //alert("Muchas gracias por Inscribirse, espere en su correo electronico más información"); 
  65.     document.fvalida.submit(); 
  66. }
  67.  
  68. function MM_preloadImages() { //v3.0
  69.   var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
  70.     var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
  71.     if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
  72. }
  73. </script>
  74. <style type="text/css">
  75. .txt1 {
  76.     font-size: 10px;
  77. }
  78. .txt1 {
  79.     font-size: 12px;
  80. }
  81. .txt1 .txt1 strong {
  82.     font-size: 14px;
  83. }
  84. .text22 {
  85.     color: #039;
  86. }
  87. .txt1 .txt1 strong {
  88.     font-family: Arial, Helvetica, sans-serif;
  89.     font-size: 12px;
  90. }
  91. .txt1 .text22 strong {
  92.     font-family: Arial, Helvetica, sans-serif;
  93. }
  94. .txt1 .text22 strong {
  95.     font-size: 12px;
  96. }
  97. .txt1 .text22 strong {
  98.     font-family: Arial, Helvetica, sans-serif;
  99.     text-align: center;
  100. }
  101. .txt1 .txt1 strong {
  102.     text-align: center;
  103. }
  104. #apDiv1 {
  105.     position:absolute;
  106.     left:87px;
  107.     top:558px;
  108.     width:188px;
  109.     height:45px;
  110.     z-index:1;
  111. }
  112. .txt {
  113.     font-family: Arial, Helvetica, sans-serif;
  114.     text-align: justify;
  115.     font-size: 13px;
  116. }
  117. #apDiv2 {
  118.     position:absolute;
  119.     left:12px;
  120.     top:16px;
  121.     width:360px;
  122.     height:106px;
  123.     z-index:1;
  124. }
  125. #apDiv3 {
  126.     position:absolute;
  127.     left:148px;
  128.     top:595px;
  129.     width:80px;
  130.     height:34px;
  131.     z-index:1;
  132. }
  133. </style>
  134. </head>
  135.  
  136. <body>
  137. <table width="359" border="0" cellpadding="0" cellspacing="0">
  138.   <tr>
  139.     <td width="359"><center><img src="arriba2.jpg" width="360" height="107" /></center></td>
  140.   </tr>
  141.   <tr>
  142.     <td height="506"><form id="fvalida" name="fvalida" method="post" action="enviar.php">
  143.       <table width="338" border="0" align="center" cellpadding="0" cellspacing="1">
  144.         <tr>
  145.           <td height="63" colspan="2"><img src="regeltainscanimado.gif" width="324" height="63" /></td>
  146.         </tr>
  147.         <tr>
  148.           <td height="19" colspan="2" class="txt">Muchas gracias por su interes en participar en el Taller Redes Sociales, por favor para continuar, suministre la informacion personal del siguiente formulario y asi validar su incripción.</td>
  149.         </tr>
  150.         <tr>
  151.           <td width="150" height="19" class="txt">&nbsp;</td>
  152.           <td width="182">&nbsp;</td>
  153.         </tr>
  154.         <tr>
  155.           <td height="28" class="txt">Nombres:</td>
  156.           <td><input type="text" name="nombres" id="nombres" /></td>
  157.         </tr>
  158.         <tr>
  159.           <td height="28" class="txt">Apellidos:</td>
  160.           <td><input type="text" name="apellidos" id="apellidos" /></td>
  161.         </tr>
  162.         <tr>
  163.           <td height="28" class="txt">Tipo Identificación:</td>
  164.           <td><select name="tipo" id="tipo">
  165.             <option value="0">Seleccione</option>
  166.             <option value="Cedula de Ciudadania">Cédula de Ciudadania</option>
  167.             <option value="Tarjeta de Identidad">Tarjeta de Identidad</option>
  168.             <option value="Cedula Extranjeria">Cédula Extranjería</option>
  169.             <option value="Otro">Otro</option>
  170.           </select></td>
  171.         </tr>
  172.         <tr>
  173.           <td height="26" class="txt">Numero de Identificación:</td>
  174.           <td><input name="numeroidentificacion" type="text" id="numeroidentificacion" maxlength="14" /></td>
  175.         </tr>
  176.         <tr>
  177.           <td height="26" class="txt">Correo Electronico:</td>
  178.           <td><input type="text" name="correo" id="correo" /></td>
  179.         </tr>
  180.         <tr>
  181.           <td height="27" class="txt">Edad:</td>
  182.           <td><input name="edad" type="text" id="edad" size="3" maxlength="2" /></td>
  183.         </tr>
  184.         <tr>
  185.           <td height="29" class="txt">Ocupación:</td>
  186.           <td><input type="text" name="ocupacion" id="ocupacion" /></td>
  187.         </tr>
  188.         <tr>
  189.           <td height="30" class="txt">Celular o Teléfono:</td>
  190.           <td><input name="celular" type="text" id="celular" maxlength="11" /></td>
  191.         </tr>
  192.         <tr>
  193.           <td height="26" class="txt">Lugar de Residencia:</td>
  194.           <td><input type="text" name="residencia" id="residencia" /></td>
  195.         </tr>
  196.         <tr>
  197.           <td height="19" class="txt">&nbsp;</td>
  198.           <td height="19" class="txt"><input type="button" value="Inscribirse" onclick="valida_envia()" /></td>
  199.           </tr>
  200.         <tr>
  201.           <td height="26" colspan="2" class="txt"><center></center></td>
  202.           </tr>
  203.       </table>
  204.       <span class="txt1"><strong>
  205. <center>
  206.   <a href="anuncio.html"><img src="regresar1.jpg" name="regrbotn" width="80" height="34" border="0" id="regrbotn" onclick="history.back(-1);"/></a>
  207. </center>    <br />
  208.       </strong></span>
  209.     </form></td>
  210.   </tr>
  211. </table>
  212. <p>&nbsp;</p>
  213. <p>&nbsp;</p>
  214. <p>&nbsp;</p>
  215. <p>&nbsp;</p>
  216. </body>
  217. </html>