Foros del Web » Programando para Internet » Javascript »

Acceder a input dentro de una tabla

Estas en el tema de Acceder a input dentro de una tabla en el foro de Javascript en Foros del Web. Bueno mi problema es el siguiente : Tengo una caja de texto en un formulario , que se llena automaticamente con la edad de la ...
  #1 (permalink)  
Antiguo 12/07/2012, 19:23
 
Fecha de Ingreso: diciembre-2003
Ubicación: Santa Fe
Mensajes: 52
Antigüedad: 20 años, 3 meses
Puntos: 0
Pregunta Acceder a input dentro de una tabla

Bueno mi problema es el siguiente :
Tengo una caja de texto en un formulario , que se llena automaticamente con la edad de la persona al ingresar esta su fecha de nacimiento en otra caja de texto , utilizo el siguiente codigo:

function edad(Fecha){
fecha = new Date(Fecha)
hoy = new Date()
ed = parseInt((hoy -fecha)/365/24/60/60/1000)
document.getElementById('pepe').value = "tienes " + ed + " años"
}

y despues en los input :

<input type="text" name="textfield" onblur="edad(this.value)" />
<input type="text" name="pepe" id="pepe" />

hasta aca todo bien , funciona , el tema es cuando meto estos input en una tabla que esta dentro de un formulario

<tr>
<td> <input type="text" name="textfield" onblur="edad(this.value)" /></td>
<td><input type="text" name="pepe" id="pepe" /></td>
</tr>

aca ya no funciona , segun mi intuicion es algo que tiene que ver con el DOM de javascript o sea la forma de acceder a los elementos del form o algo asi ..

Alguien me puede ayudar ?? gracias.....
  #2 (permalink)  
Antiguo 12/07/2012, 21:31
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 9 meses
Puntos: 1567
Respuesta: Acceder a input dentro de una tabla

no hay ningún impedimento para que getElementById no pueda identificar un campo, esté o no dentro de una tabla.
Ahora con respecto a tu función, ni idea de que objetivo cumple
fecha = new Date(Fecha) --> el formato de Fecha cual es?
hoy = new Date() --> te devuelve algo asi como Fri Jul 13 2012 00:20:35 GMT-0300 , vas a usar eso en una operación aritmética?

Cita:
hasta aca todo bien , funciona ,
Se puede saber que es lo que funciona?
Sólo a efectos de que verifiques (que es lo primero que deberías haber hecho)
Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <title>getElementById</title>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  6. <script type="text/javascript">
  7. //<![CDATA[
  8. window.onload = function(){
  9. document.getElementById('pepe').value = "mi nombre es Pepe";
  10. document.getElementById('emprear').innerHTML = "mi nombre es Emprear"; 
  11. }
  12. //]]>
  13. </head>
  14. <form action="#">
  15. <tr><td>Nombre</td><td><input type="text" name="pepe" id="pepe" /></td></tr>
  16. </form>
  17. <div id="emprear"></div>
  18. </body>
  19. </html>


__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #3 (permalink)  
Antiguo 12/07/2012, 21:58
 
Fecha de Ingreso: diciembre-2003
Ubicación: Santa Fe
Mensajes: 52
Antigüedad: 20 años, 3 meses
Puntos: 0
Respuesta: Acceder a input dentro de una tabla

Primeramente gracias por tu respuesta , ahora te invito a que lo pruebes , te puedo asegurar que funciona , el tema es cuando lo pongo dentro de <tr><td> aca los inputs </td></tr>

ya no funciona , pero si no si , me paro en el primer input pongo por ejempl0 07/08/2012 y al hacer click en el otro me tira la edad
  #4 (permalink)  
Antiguo 12/07/2012, 22:03
 
Fecha de Ingreso: diciembre-2003
Ubicación: Santa Fe
Mensajes: 52
Antigüedad: 20 años, 3 meses
Puntos: 0
Respuesta: Acceder a input dentro de una tabla

No se que quisiste hacer con tu ejemplo , lo que yo tengo que hacer es tomar la fecha de un campo que ingrese el usuario y despues en base a esa fecha con la actual calcular la edad
  #5 (permalink)  
Antiguo 12/07/2012, 22:24
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 9 meses
Puntos: 1567
Respuesta: Acceder a input dentro de una tabla

Por eso mismo te pregunto cual es el formato de Fecha, lo cual estás aclarando recien ahora

y si no entendiste mi ejemplo quizás esto te clarifique más, no es má que tu código
Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <title>titulo</title>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  6. <script type="text/javascript">
  7. //<![CDATA[
  8. function edad(Fecha){
  9. fecha = new Date(Fecha);
  10. hoy = new Date();
  11. ed = parseInt((hoy -fecha)/365/24/60/60/1000);
  12. document.getElementById('pepe').value = "tienes " + ed + " años";
  13. document.getElementById('pepe2').value = "tienes " + ed + " años";
  14. }
  15. //]]>
  16. </head>
  17. id pepe 2<input type="text" id="pepe2" />
  18.   <table border="1">
  19. <tr>
  20.  <td>fecha<input type="text" name="textfield" onblur="edad(this.value)" /></td>
  21.  <td>edad<input type="text" name="pepe" id="pepe" /></td>
  22.  </tr>
  23.  </table>
  24. </body>
  25. </html>
Tomate el trabajo de ejecutarlo y vas a ver que los campos pepe / pepe2 se completan correctamente
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #6 (permalink)  
Antiguo 12/07/2012, 22:45
 
Fecha de Ingreso: diciembre-2003
Ubicación: Santa Fe
Mensajes: 52
Antigüedad: 20 años, 3 meses
Puntos: 0
Respuesta: Acceder a input dentro de una tabla

pongo esto despues de </form>

<input type="text" name="textfield" onblur="edad(this.value)" />
<input type="text" name="pepe" id="pepe" />

y funciona , despues pruebo comentar lo anterior y ponerlo asi dentro de <table></table>


<tr>
<td> <input type="text" name="textfield" onblur="edad(this.value)" /></td>
<td><input type="text" name="pepe" id="pepe" /></td>
</tr>

y no funca , no aparece nada en el campo edad ..
que raro..
  #7 (permalink)  
Antiguo 12/07/2012, 22:52
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 9 meses
Puntos: 1567
Respuesta: Acceder a input dentro de una tabla

Probaste mi ejemplo, funciona?

Y por que no pasas el html completo de lo que no te funciona, poniendo fragmentos no aclarás nada

poné todo
<html>
.....
script y body

</html>
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #8 (permalink)  
Antiguo 12/07/2012, 22:59
 
Fecha de Ingreso: diciembre-2003
Ubicación: Santa Fe
Mensajes: 52
Antigüedad: 20 años, 3 meses
Puntos: 0
Respuesta: Acceder a input dentro de una tabla

Gracias , por tus respuestas lo tuyo si funciona , te paso el codigo , fijate lo que dice ESTO SI FUNCIONA y lo que dice ESTO NO FUNCIONA

<?php
include("./includes/combogenerico.php");//incluyo la funcion php que genera combos genericos pasandoles dos campos y la tabla.
?>
<!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>

<title>Solicitudes de pensiones</title>


<script language="javascript" type="text/javascript" src="./includes/js/funciones.js"></script> <!--// Incluyo el archivos de funciones javascript//-->
<link rel="STYLESHEET" type="text/css" href="./css/stylo.css"> <!--// Incluyo el archivos de estilo css//-->

<meta http-equiv="content-type" content="text/html; charset=utf-8" />


<script language="JavaScript"> <!--// funcion javascript para validar campos de textos//-->

function validar(idcampo, mensaje) {

var cadena = document.getElementById(idcampo).value;

var exp_reg = /^[a-z\u00C0-\u00ff]+$/i;

var verifica = exp_reg.test(cadena);

if (verifica == true){

//alert('ok');

document.getElementById(mensaje).innerHTML = "Correcto";

}else {

//alert('error');

document.getElementById(mensaje).innerHTML = "Incorrecto";

return false;

}

}
//<![CDATA[
function edad(Fecha){
fecha = new Date(Fecha);
hoy = new Date();
ed = parseInt((hoy -fecha)/365/24/60/60/1000);
document.getElementById('pepe').value = "tienes " + ed + " años";

}
//]]>
</script>
</head>


<BODY>


<FORM name="form" action="procesosolicitud.php" method="GET">
<!--// <img src="logo.gif" align=right WIDTH=90, HEIGTH=90>//-->
<h1><center>CPS 5110 -Solicitud de pension-</h1></center>

<table align="center" width=1100 border=10 >

<tr> <td>Seleccione delegacion</td>
<td>
<?php combo("enabled","dpto","id_dpto","texto_dpto","dbf ley.departamento"); ?>
</td>
</tr>

<tr>
<td> Numero de solicitud</td> <td><INPUT type="text" name="3"
</td>
</tr>

<tr>
<td> Numero de expediente </td> <td><INPUT type="text" name="6"></td>
</tr>
<tr>
<td> Numero de expediente clasificado</td> <td><INPUT type="text" name="4"></td>
</tr>

<tr>
<td>Apellido y Nombre</td> <td><INPUT type="text" name="1" size="50" maxlength="50" onkeyup="validar(this.id,'mensaje_nombre');" id="nombre">

<span id="mensaje_nombre"></span>
</td>
</tr>

<tr>
<td> Tipo y numero de documento</td> <td> <?php combo("enabled","depto2","id_tdoc","texto_tdoc","d bfley.tipodocumento");?>
<INPUT type="text" name="nacio" size="10" maxlength="8"> Fecha de nacimiento
<input name="fecha" type="text" size="10" maxlength="10" onKeyUp = "this.value=formateafecha(this.value);">
Edad<INPUT type="text" name="edad" size="2" maxlength="2" onKeyUp = "this.value=DateDiff(document.form.nacio.value );"> Sexo<?php combo("enabled","sexo","id_sexo","texto_sexo","dbf ley.sexo"); ?></td>
</tr>

<tr>
<td> Domicilio</td> <td><INPUT type="text" name="7" size="50" maxlength="50"><?php combo("enabled","loca","id","texto","dbfley.locali dad");?></td>
</tr>
<!--//<tr>
<td> Fecha de nacimiento</td> <td><INPUT type="text" name="8"></td>

<td> Fecha de nacimiento</td> <td> <input name="fecha" type="text" size="10" maxlength="10" onKeyUp = "this.value=formateafecha(this.value);"></td>



</tr>//-->
<tr>
<td> Articulo</td><td><?php combo("enabled","arti","art","descart","dbfley.art iculos");?></td>
</tr>
<tr>
<td> Inspector</td> <td><?php combo("enabled","insp","id_inspector","texto_inspe ctor","dbfley.inspector");?></td>
</tr>
<tr>
<td> Seccional</td> <td><?php combo("enabled","seccion","id_seccional","texto_se ccional","dbfley.seccional");?></td>
</tr>
<!--//<tr>
<td><input type="checkbox" value="1″ name="represent" onclick="btTutorial.disabled = !this.checked">Representante </td>
<td><input type="text" value="Enviar" name="btTutorial" disabled></td>
</tr>//-->

<!--// <tr>
<td><input type="checkbox" value="1″ name="represent" onclick="uno.disabled = !this.checked;dos.disabled = !this.checked;tres.disabled = !this.checked">Representante </td>
<td><input type="text" value="Enviar" name="uno" size="5" maxlength="5" disabled>
<input type="text" value="Env" name="dos" size="5" maxlength="5" disabled>
<input type="text" value="Envar" name="tres" size="5" maxlength="5" disabled></td>
</tr>//-->


<tr>
<td><input type="checkbox" name="represent" value="1″ onclick="uno.disabled = !this.checked;dos.disabled = !this.checked;tres.disabled = !this.checked;cuatro.disabled = !this.checked">Representante </td>
<td> Tipo y numero de documento <?php combo("disabled","uno","id_tdoc","texto_tdoc","dbf ley.tipodocumento");?>
<INPUT type="text" name="dos" size="8" maxlength="8" disabled> Fecha de nacimiento
<input name="tres" type="text" size="10" maxlength="10" onKeyUp = "this.value=formateafecha(this.value);" disabled>
Edad<INPUT type="text" name="cuatro" size="1" maxlength="2" onKeyUp = "this.value=DateDiff(document.form.nacio.value );" disabled></td>
</tr>

<tr>
<td> Fecha de iniciacion</td>
<td> <input name="fecha" type="text" id="fecha" value="<?php echo date("d/m/Y"); ?>" </td>
</tr>
<tr>
<td>Ubicacion-Listado</td> <td><?php combo("enabled","ubica","id_ubi","texto_ubi","dbfl ey.ubicacion");?></td>
</tr>

<tr>
<td> Observaciones</td> <td><INPUT type="text" name="15" size="100" maxlength="400"></td>
</tr>

<!--//

ESTO NO FUNCIONA:
<tr>
<td> <input type="text" name="textfield" onblur="edad(this.value)" /></td>
<td><input type="text" name="pepe" id="pepe" /></td>
</tr>//-->

</table>

<input type="submit" name="boton1" value="Aceptar y Guardar Solicitud" class="boton">



<!--//la clase boton esta definida en el archivo stylo.css//-->




</FORM>
<!--//
ESTO SI FUNCIONA:

<input type="text" name="textfield" onblur="edad(this.value)" />
<input type="text" name="pepe" id="pepe" />//-->

</BODY>
</html>
  #9 (permalink)  
Antiguo 12/07/2012, 23:43
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 9 meses
Puntos: 1567
Respuesta: Acceder a input dentro de una tabla

no te funciona porque tu html es un desastre, limpiandolo un poco
Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2.    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <title>Solicitudes de pensiones</title>
  5. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  6. <script type="text/javascript">
  7. //<![CDATA[
  8.  
  9.  
  10. function edad(Fecha){
  11. fecha = new Date(Fecha);
  12. hoy = new Date();
  13. ed = parseInt((hoy -fecha)/365/24/60/60/1000);
  14. document.getElementById('pepe').value = "tienes " + ed + " años";
  15.  
  16. }
  17.  
  18. //]]>
  19. </head>
  20. <form name="form" action="procesosolicitud.php" method="get" id="form"><!--// <img src="logo.gif" align=right WIDTH=90, HEIGTH=90>//-->
  21. <center>
  22. <h1>CPS 5110 -Solicitud de pension-</h1>
  23. </center>
  24. <table align="center" width="1100" border="10">
  25. <tr>
  26. <td>Seleccione delegacion</td>
  27. <td></td>
  28. </tr>
  29. <tr>
  30. <td>Numero de solicitud</td>
  31. <td><input type="text" name="3" /></td>
  32. </tr>
  33. <tr>
  34. <td>Numero de expediente</td>
  35. <td><input type="text" name="6" /></td>
  36. </tr>
  37. <tr>
  38. <td>Numero de expediente clasificado</td>
  39. <td><input type="text" name="4" /></td>
  40. </tr>
  41. <tr>
  42. <td>Apellido y Nombre</td>
  43. <td><input type="text" name="1" size="50" maxlength="50" onkeyup="validar(this.id,'mensaje_nombre');" id="nombre" /><span id="mensaje_nombre"></span></td>
  44. </tr>
  45. <tr>
  46. <td>Domicilio</td>
  47. <td><input type="text" name="7" size="50" maxlength="50" /></td>
  48. </tr>
  49.  
  50. <tr>
  51. <td>Articulo</td>
  52. <td></td>
  53. </tr>
  54. <tr>
  55. <td>Inspector</td>
  56. <td></td>
  57. </tr>
  58. <tr>
  59. <td>Seccional</td>
  60. <td></td>
  61. </tr>
  62.  
  63. <tr>
  64. <td>Fecha de iniciacion</td>
  65. <td><input name="fecha" type="text" id="fecha" value="" /></td>
  66. </tr>
  67. <tr>
  68. <td>Ubicacion-Listado</td>
  69. <td></td>
  70. </tr>
  71. <tr>
  72. <td>Observaciones</td>
  73. <td><input type="text" name="15" size="100" maxlength="400" /></td>
  74. </tr>
  75. <tr>
  76. <td>xxxxx <input type="text" name="textfield" onblur="edad(this.value)" /></td>
  77. <td><input type="text" name="pepe" id="pepe" /></td>
  78. </tr>
  79. <input type="submit" name="boton1" value="Aceptar y Guardar Solicitud" class="boton" /><!--//la clase boton esta definida en el archivo stylo.css//--></form>
  80.  
  81. </body>
  82. </html>
si funciona

acostumbrate a pasar el html generado, no el php y a usar el highlight del editor del foro
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #10 (permalink)  
Antiguo 13/07/2012, 09:17
 
Fecha de Ingreso: diciembre-2003
Ubicación: Santa Fe
Mensajes: 52
Antigüedad: 20 años, 3 meses
Puntos: 0
Respuesta: Acceder a input dentro de una tabla

si le saco todo y queda html puro si funciona , el tema es el codigo completo ya lo revise y ordene y no veo cual es el error , todo esta bien... debe ser algo de php ...??

Etiquetas: formulario, funcion, input, tabla
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:17.