Ver Mensaje Individual
  #1 (permalink)  
Antiguo 24/08/2008, 09:01
scorm
 
Fecha de Ingreso: julio-2008
Mensajes: 85
Antigüedad: 15 años, 11 meses
Puntos: 2
Poner <input type="text" en diferentes partes al pulsar un botón

A ver si podeis ayudarme...
Lo qe quiero conseguir (y no se si se puede) hacer una jerarquía de <input type="text"... al pulsar un botón aparece el primero, si pulso ese input y vuelvo a pulsar el botón debería aparecer otro <input... debajo del anterior pero un poco a la derecha, si no tengo pulsado ningún <input... al darle al boton aparecería el <input... al final, a la izquierda (como el primero).

Ahora mismo, como no sé si se pueden seleccionar <input y hacer lo que quiero, lo único que intento es que al pulsar un botón aparezcan <inputs a la izquierda y al pulsar otro aparezcan los inputs un poco a la derecha... pero no lo consigo, aparecen siempre unos debajo de otros... Os dejo el código... a ver si veis que es lo que falla...

Código:
<script>

num=0;
function crear(obj) {
  num++;
  fi = document.getElementById('fiel'); // 1
  contenedor = document.createElement('div'); // 2
  contenedor.id = 'div'+num; // 3
  contenedor.style.float='left';
  contenedor.style.width = '45%';
  
  fi.appendChild(contenedor); // 4

  ele = document.createElement('input'); // 5
  ele.type = 'text'; // 6
  ele.name = 'cap'+num; // 6
  contenedor.appendChild(ele); // 7
  
  ele = document.createElement('input'); // 5
  ele.type = 'button'; // 6
  ele.value = 'Borrar'; // 8
  ele.name = 'div'+num; // 8
  ele.onclick = function () {borrar(this.name)} // 9
  contenedor.appendChild(ele); // 7
}
function borrar(obj) {
  fi = document.getElementById('fiel'); // 1 
  fi.removeChild(document.getElementById(obj)); // 10
}

num1=0;
function crear1(obj) {
  num1++;
  fi = document.getElementById('fiel1'); // 1
  contenedor = document.createElement('div'); // 2
  contenedor.id = 'sub'+num1; // 3
  contenedor.style.float='left';
  contenedor.style.width = '45%';
  fi.appendChild(contenedor); // 4

  ele = document.createElement('input'); // 5
  ele.type = 'text'; // 6
  ele.name = 'scap'+num1; // 6
  contenedor.appendChild(ele); // 7
  
  ele = document.createElement('input'); // 5
  ele.type = 'button'; // 6
  ele.value = 'Borrar'; // 8
  ele.name = 'sub'+num1; // 8
  ele.onclick = function () {borrar1(this.name)} // 9
  contenedor.appendChild(ele); // 7
}
function borrar1(obj) {
  fi = document.getElementById('fiel1'); // 1 
  fi.removeChild(document.getElementById(obj)); // 10
}

</script>
Código HTML:
<div>
  <div align="center">
  	<input type="button" value="capitulo" name="capitulo" onclick="crear(this)"/>
  	<input type="button" value="subcapitulo" name="subcapitulo" onclick="crear1(this)"/>
  </div>
</div> 
Muchas gracias