Ver Mensaje Individual
  #2 (permalink)  
Antiguo 17/06/2011, 16:32
Avatar de Naahuel
Naahuel
 
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 11 años, 5 meses
Puntos: 192
Respuesta: Crear tabla html editable con javascript

Podríamos modificar un poco la función edita() para que tome todo un rango de celdas y no sólo una:

Código Javascript:
Ver original
  1. <script type="text/javascript">
  2. function modifica() {
  3.   tab=document.getElementById('tabla');
  4.   for (i=0; ele=tab.getElementsByTagName('input')[i]; i++) {
  5.     if (ele.checked) edita(ele);
  6.     ele.checked = false;
  7.   }
  8. }
  9. function edita(obj) {
  10.   padre = obj.parentNode.parentNode;
  11.   celda = padre.getElementsByTagName('td');
  12.   inicio = 2;//celda para comenzar
  13.   fin = 6;//celda para terminar
  14.  
  15.   for(i=inicio;i<fin;i++){
  16.   var celdaTmp = celda[i];
  17.    
  18.   txt = celdaTmp.innerHTML;
  19.   celdaTmp.innerHTML = '';
  20.   inp = celdaTmp.appendChild(document.createElement('input'));
  21.   inp.value=txt;
  22.   inp.onblur = function() { this.parentNode.innerHTML = this.value  }
  23.    
  24.      
  25.   }
  26. }
  27. </script>

Tal vez es un poco molesto cómo se cierran cuando pierden foco (aunque a mi me resulta divertido) pero se puede solucionar con una estilización unificando dimensiones de celdas y de los inputs.
__________________
nahueljose.com.ar