Eliminar inputtext dinamicamente

gusanoide · #1 (**permalink**) 14/08/2006, 00:07

Saludos!, andaba buscando una forma de agregar imput text dinamicamente y encontre esta forma:

Cita:

<html>
<head>
<title></title>
<script language="javascript">
function agregar()
{
var i = 1;
intxt.innerHTML = intxt.innerHTML +"<input type='text' name='texto'+ i><br>"
}
</script>

</head>
<body>

<form name="form" action="post" method="">
<input type="text" name="texto">
<a href="#" onClick="agregar()">agregar</a>
<div id="intxt"></div>

</body>

Y funciona muy bien pero el detalle es que en caso que quiera eliminar algun input text...como diantres le hago??!!

...bueno se aceptan sugerencias, muchas gracias...de antemano por las respuestas.

amnix · #2 (**permalink**) 14/08/2006, 09:15

prueba con esto:

Cita:

table = document.all.item(pTableId);
row = document.all.item(pRowId);
table.deleteRow(row.rowIndex);

donde:
pTableId= nombre de la tabla donde se encuentra tu input text;
pRowId= nombre del InputText;

krloss · #3 (**permalink**) 14/08/2006, 09:23

salu 2
ah yo tbm tenia es problema pero el mio era con un texbox y un radio button bueno espero q te sirva ya esta funcionando

Código PHP:

  <html> 

<head>

<title>Crear input file</title>

 
<script type="text/javascript">

 
num=0;

function crear(obj) {

  num++;

  fi = document.getElementById('fiel'); // ponemos en el field 

  contenedor = document.createElement('div');   

  contenedor.id = 'div'+num; 

  fi.appendChild(contenedor); 

  ele=document.createElement('input');

  ele.type='text';

  ele.name='text-'+num;

  contenedor.appendChild(ele);

 

  ele = document.createElement('input'); 

  ele.type = 'radio'; 

  ele.name='a';

  ele.value='id-'+num;

  contenedor.appendChild(ele); //el appendchild parece q no funciona (innerhtml)

 
  ele = document.createElement('input');

  ele.type = 'button'; 

  ele.value = 'Borrar'; 

  ele.name = 'div'+num; 

  ele.onclick = function () {borrar(this.name)} 

  contenedor.appendChild(ele); 

 
}

function borrar(obj) {

  fi = document.getElementById('fiel');  

  fi.removeChild(document.getElementById(obj)); 

}

 

</script>

</head>

<body>

<form >

<fieldset id="fiel">

<input type="button" value="Crear" onclick="crear(this)" />

 
</fieldset>

</form> 

</body>

 
</html>

salu2

gusanoide · #4 (**permalink**) 14/08/2006, 23:23

Que hay!...pssss intente con ambos ejemplos...el de anmix la verdad no me funciono...ya que mencionas el trabajar con una tabla...pero los input text los creo dentro de una div ...lo modifique obteniendo algo asi:

Cita:

function deleteRow() {
d.innerHTML= document.all.item("div");
row = document.all.item('txt1_');
div.deleteRow(row.rowIndex);
}

Pero no funciono...el Caso de Karloss ..lo probe y funciona muy bien...el detalle esta en que aparte del input text necesito crear tambien en el mismo renglon dinamicamente un select alimentado por los registros de una tabla (esto en asp), lo cual en el ejemplo que publique al principio funciona muy bien...pero con tu ejemplo Krloss no se ni por donde comenzar!...creo que esta algo complejo para mi este ejemplo porque el codigo de lo que use es este:

Cita:

y funciona perfectamente...pero al intentar aplicar algo similar pero con el ejemplo de krloss me pierdo por completo!, nuevamente se aceptan sugerencias...gracias de antemano por la ayuda.

Cap.Buscapina · #5 (**permalink**) 15/08/2006, 10:13

la forma correcta sería utilizando DOM, tanto para crearlos como para eliminarlos (así te aseguras de que funcione en todos los navegadores).

Cita:

<html>
<head>
<title></title>
<script language="javascript">
var i=1;

function agregar()
{
padre=document.getElementById('intxt');
hijo=document.createElement('input');
hijo.type="text";
hijo.name="texto"+i;
hijo.id="id"+i;
br=document.createElement('br');
br.id="br"+i;
padre.appendChild(hijo);
padre.appendChild(br);
i++;
}

function borrar(){
i--;
padre=document.getElementById('intxt');
padre.removeChild(document.getElementById("id"+i)) ;
padre.removeChild(document.getElementById("br"+i)) ;
}
</script>

</head>
<body>

<form name="form" action="post" method="">
<input type="text" name="texto">
<a href="#" onClick="agregar()">agregar</a>
<a href="#" onClick="borrar()">borrar</a>
<div id="intxt"></div>
</form>

</body>
</html>