Bueno, esta en sucio pero ya esta terminada la aplicación para agregar campos input y borrarlos.
El ódigo de serie lleva 4 input type="text" para insertar el resultado de 2 partidos, pero dispone de un boton "Añadir partido" que lo que hace es agregar 2 inputs mas para agregar el resultado de 1 partido mas.
También tiene el botón para eliminar secuencialmente los inputs insertados.
Código:
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--//
var newsInputs = 0;
var defecto = 4;
function addMatch(){
var puntero = document.getElementById('nextMatch'); //recogemos donde van a ir los nuevos campos
newNode = document.createElement('tr'); //creamos un elemento TR para poder agregar TD's
total = 2; //definimos cuantos inputs queremos insertar de un tiron
newsInputs++;
for(i=0;i<total;i++){
var num_equipo = document.getElementsByName('equipo').length; //recogemos el total de campos equipo que hay para asignar los nuevos ID's
newNode.appendChild(document.createElement('td')); // creamos un td dentro de newNode
var newField = document.createElement('input'); //creamos un elemento input
newField.name = 'equipo'; //le asignamos un nombre al input creado
var newEquipo = num_equipo + 1; // incrementamos el total de campos equipos para poder obtener un ID correlativo.
newField.id = 'equipo'+newEquipo; //asignamos el nuevo ID al nuevo INPUT
newNode.lastChild.appendChild(newField); //le indicamos de quien va a ser hijo.
if(i<1){ //si es la primera vez insertamos un TD como separador
newNode.appendChild(document.createElement('td'));
newNode.lastChild.appendChild(document.createTextNode('vs'));
}
puntero.parentNode.insertBefore(newNode,puntero); //insertamos todos justo encima del tr con id nextMatch, almacenado en puntero.
}
if(newsInputs==1){//añadimos el link de borrar último partido
newClose = document.createElement('a');
newClose.id='delPartido';
newClose.href='javascript:delMatch(this)';
newClose.appendChild(document.createTextNode('Borrar último'));
document.getElementById('controlMatch').appendChild(newClose);
}
centrarContenido();//centramos el contenido de los TD's para que queden bien alineados
}
function centrarContenido(){
var y = document.getElementById('tableMatchs').rows;
for(a=0;a<y.length;a++){
y[a].align='center';
}
}
function delMatch(){
var total = document.getElementsByTagName("tr").length - 1;
separador = document.getElementById("nextMatch");
separador.parentNode.removeChild(separador.parentNode.childNodes[total]);
newsInputs --;
if (newsInputs==0){
//retirar el código para borrar la última dirección de mail
document.getElementById("controlMatch").removeChild(document.getElementById("delPartido"));
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<form method="POST">
<table border="1" width="380" id="tableMatchs" cellspacing="2" cellpadding="1">
<tr><td align="center"><INPUT TYPE="text" NAME="equipo" id="equipo1"></td><td width="10" align="center">vs</td><td align="center"><INPUT TYPE="text" NAME="equipo" id="equipo2"></td></tr>
<tr><td align="center"><INPUT TYPE="text" NAME="equipo" id="equipo3"></td><td align="center">vs</td><td align="center"><INPUT TYPE="text" NAME="equipo" id="equipo4"></td></tr>
<tr id="nextMatch"><td>-</td><td>-</td><td>-</td></tr>
</table>
<br>
<table border="1" width="380">
<tr><td><center id="controlMatch"><a href="javascript:addMatch();">Añadir partido</a> </center></td></tr>
</table>
</form>
</body>
gracias a tunait, javierB y demás por la ayuda.
Saludos.!!!!!
