Foros del Web » Programando para Internet » Javascript »

como validar campos en una tabla dinamica??

 Estas en el tema de como validar campos en una tabla dinamica?? en el foro de Javascript en Foros del Web. Hola a todos tengo un problema, tengo una tabla dinamica la cual agrego filas y la borro pero aparte de eso quiero validar los input ...
  #1 (permalink)  
Antiguo 25/11/2008, 18:41
Avatar de kilpo  
Fecha de Ingreso: noviembre-2008
Mensajes: 19
Antigüedad: 16 años
Puntos: 0
Mensaje como validar campos en una tabla dinamica??
Hola a todos tengo un problema, tengo una tabla dinamica la cual agrego filas y la borro pero aparte de eso quiero validar los input para poder ingresarlo en una base de dato este es el codigo

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=iso-8859-1" />
  5. <title>Untitled Document</title>
  6.   
  7. <script language='javascript' src="popcalendar.js"></script> 
  8.  
  9.  
  10.  
  11. <script language=javaScript1.2>
  12. var cont=2;
  13.  
  14. function suma() {
  15. var miTabla = document.getElementById("cuerpoTabla");
  16.  
  17.     
  18.  
  19. var fila = document.createElement("tr");
  20. var celda1 = document.createElement("td");
  21. var celda2 = document.createElement("td");
  22. var celda3 = document.createElement("td");
  23. var celda4 = document.createElement("td");
  24. var celda5 = document.createElement("td");
  25. var celda6 = document.createElement("td");
  26. var celda7 = document.createElement("td");
  27. var celda8 = document.createElement("td");
  28. var celda9 = document.createElement("td");
  29. celda1.innerHTML = "" + "<input name=cod"+cont+" type=text id=cod"+cont+" size=10>";
  30. celda2.innerHTML = "" + "<textarea name=espe"+cont+" rows=2 id=espe"+cont+"></textarea>";
  31. celda3.innerHTML = "" + "<input name=unidad"+cont+" type=text id=unidad"+cont+" size=7>";
  32. celda4.innerHTML = "" + "<input name=cant"+cont+" type=text id=cant"+cont+" size=11>";
  33. celda5.innerHTML = "<input name=fecha"+cont+" type=text onclick=\"popUpCalendar(this, form1.dateArrival"+cont+", 'mm-dd-yyyy')\" id=dateArrival"+cont+" size=10>" ;
  34. celda6.innerHTML =  "<input name=ppro"+cont+" type=text id=ppro"+cont+">";
  35. celda7.innerHTML = "" + "<input name=pcom"+cont+" type=text id=pcom"+cont+">";
  36. celda8.innerHTML = "" +  "<input name=prov"+cont+" type=text id=prov"+cont+">";
  37. celda9.innerHTML = "" +  "" ;
  38. fila.appendChild(celda1);
  39. fila.appendChild(celda2);
  40. fila.appendChild(celda3);
  41. fila.appendChild(celda4);
  42. fila.appendChild(celda5);
  43. fila.appendChild(celda6);
  44. fila.appendChild(celda7);
  45. fila.appendChild(celda8);
  46. fila.appendChild(celda9);
  47. miTabla.appendChild(fila);
  48. cont++;
  49. }
  50.  
  51.  
  52. </script>
  53.  
  54. <style type="text/css">
  55. /*
  56. Theme: Dark Night
  57. Author: Michael Schmieding
  58. Web site: http://www.slifer.de/
  59. */
  60.  
  61. table a, table, tbody, tfoot, tr, th, td, table caption {
  62.     font-family: Verdana, arial, helvetica, sans-serif;
  63.     background:#262b38;
  64.     color:#fff;
  65.     text-align:left;
  66.     font-size:9px;
  67. }
  68. table, table caption {
  69.     border-left:3px solid #567;
  70.     border-right:3px solid #000;
  71. }
  72. table {
  73.     border-top:1px solid #567;
  74.     border-bottom:3px solid #000;
  75. }
  76. table a {
  77.     text-decoration:underline;
  78.     font-weight:bold;
  79. }
  80. table a:visited {
  81.     background:#262b38;
  82.     color:#abc;
  83. }
  84. table a:hover {
  85.     text-decoration:none;
  86.     position:relative;
  87.     top:1px;
  88.     left:1px;
  89. }
  90. table caption {
  91.     border-top:3px solid #567;
  92.     border-bottom:1px solid #000;
  93.     font-size:9px;
  94.     font-weight:bold;
  95. }
  96. table, td, th {
  97.     margin:0px;
  98.     padding:0px;
  99. }
  100. tbody td, tbody th, tbody tr.odd th, tbody tr.odd td {
  101.     border:1px solid;
  102.     border-color:#567 #000 #000 #567;
  103. }
  104. td, th, table caption {
  105.     padding:5px;
  106.     vertical-align:middle;
  107. }
  108. tfoot td, tfoot th, thead th {
  109.     border:1px solid;
  110.     border-color:#000 #567 #567 #000;
  111.     font-weight:bold;
  112.     white-space:nowrap;
  113.     font-size:14px;
  114. }
  115. .style3 {font-size: 9px}
  116. body {
  117.     background-image: url(images/fondo.png);
  118.     background-repeat: repeat;
  119. }
  120. </style>
  121.  
  122.  
  123.  
  124. </head>
  125.  
  126. <body>
  127.  
  128.   <p>&nbsp;</p>
  129.  
  130. <button onclick="suma()">Agregar</button>
  131.  
  132. <form id="form1" name="form1" method="get" action="guardar.php">
  133.     <table width="1149" border="1" align="center" id="unaTabla">
  134.     <tbody id="cuerpoTabla">
  135.      
  136.       <tr id="a1">
  137.         <td scope="col" width="195" id="c1"><span class="style3">Codigo</span></td>
  138.         <td scope="col" width="110" id="c1"><span class="style3">Especificaciones</span></td>
  139.         <td scope="col" width="114" id="c1"><span class="style3">Unidades</span></td>
  140.         <td scope="col" width="144" id="c1"><span class="style3">Cantidad</span></td>
  141.         <td scope="col" width="144" id="c1"><span class="style3">Fecha de Obra </span></td>
  142.         <td scope="col" width="144" id="c1"><span class="style3">Precio propuesta </span></td>
  143.         <td scope="col" width="144" id="c1"><span class="style3">Precio Compra</span></td>
  144.         <td scope="col" width="48" id="c1"><span class="style3">Proveedor</span></td>
  145.         <td scope="col" width="48" id="c1">&nbsp;</td>
  146.       </tr>
  147.      
  148.       <tr align="center" id="a2">
  149.         <td  scope="row" id="c2"><input name="cod1" type="text" id="cod1" size="10" /></td>
  150.         <td  scope="row" id="c2"><textarea name="espe1" rows="2" id="espe1"></textarea></td>
  151.         <td  scope="row" id="c2"><input name="unidad1" type="text" id="unidad1" size="7" /></td>
  152.         <td  scope="row" id="c2"><input name="cant1" type="text" id="cant1" size="11" /></td>
  153.         <td  scope="row" id="c2"><input name="fecha1" type="text" onclick="popUpCalendar(this, form1.dateArrival, 'mm-dd-yyyy')" id="dateArrival" size="10" /></td>
  154.         <td  scope="row" id="c2"><input name="ppro1" type="text" id="ppro1" /></td>
  155.         <td  scope="row" id="c2"><input name="pcom1" type="text" id="pcom1" /></td>
  156.         <td  scope="row" id="c2"><input name="prov1" type="text" id="prov1" /></td>
  157.         <td  scope="row" id="c2">&nbsp;</td>
  158.       </tr>
  159.     </tbody>
  160.   </table>
  161.  
  162.   
  163.  
  164.   <p>
  165.     <label>
  166.     <input type="submit" name="Submit2" value="Submit" />
  167.     </label>
  168.   </p>
  169. </form>
  170. </body>
  171. </html>
he intentado formas de validar y solo logro validar la primera fila
  #2 (permalink)  
Antiguo 25/11/2008, 20:16
Avatar de Fernand0  
Fecha de Ingreso: septiembre-2005
Ubicación: Buenos Aires
Mensajes: 610
Antigüedad: 19 años, 2 meses
Puntos: 19
Respuesta: como validar campos en una tabla dinamica??
Código javascript: 
Ver original
  1. var row=0;
  2.  
  3. function suma() {
  4. var miTabla = document.getElementById("cuerpoTabla");
  5.  
  6. var fila = document.createElement("tr");
  7. fila.id='row'+row; ++row;
  8. }

Asi podrias analizar las filas especificamente... o sino... podrias llegar al TR desde los inputs con el parentNode... depende de como este realizado tu codigo

Tambien podrias recorrer la tabla con el getElementsByTagName('TR') o algo asi..
  #3 (permalink)  
Antiguo 25/11/2008, 23:59
 
Fecha de Ingreso: julio-2007
Ubicación: /home/victor
Mensajes: 114
Antigüedad: 17 años, 3 meses
Puntos: 0
Respuesta: como validar campos en una tabla dinamica??
podrias usar DOM en vez de innerHTML yo la validacion la hice con jquery y queda algo así

Código PHP:
    ///////////////////////////////////////////

    celda = fila.insertCell(6);

    var latitud = document.createElement('input') // latitud
        latitud.type = 'text';
        for (i=0;i<nuevo_indice;i++) {
        latitud.name = 'latitud[]'+i;
        latitud.id = 'latitud[]'+i;
        }
        celda.appendChild(latitud);

    /////////////////////////////////////////// 
como vez va cambiando el id y el name para después haga el trabajo jquery

Salu2
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


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 18:29.