Buenas,
el caso es que tengo una tabla de este modo:
Código HTML:
<table id="tabla">
<tr id="t1">
<td><input type="text" id="a1"></td>
<td><input type="text" id="b1"></td>
<td><input type="text" id="c1"></td>
<td><input type="button" id="bt1"></td>
</tr>
</table>
Y querría clonar la última fila, pero con los campos vacíos y los ids incrementados quedando así sucesivamente:
Código HTML:
<table id="tabla">
<tr id="t1">
<td><input type="text" id="a1"></td>
<td><input type="text" id="b1"></td>
<td><input type="text" id="c1"></td>
<td><input type="button" id="bt1" onClick="addField();"></td>
</tr>
<tr id="t2">
<td><input type="text" id="a2"></td>
<td><input type="text" id="b2"></td>
<td><input type="text" id="c2"></td>
<td><input type="button" id="bt2" onClick="addField();"></td>
</tr>
</table>
Hasta ahora he conseguido clonar la fila, pero no consigo acceder a los inputs para configurar sus ids y values:
Código:
function addField(){
//Consigo el id actual
var clickID = $("#tabla tr:last").attr('id').replace('t','');
// Genero el nuevo numero id
var newID = parseInt(clickID)+1;
// Creo un clon del elemento tr que contiene los campos de texto
fila = $("#tabla tr:last").clone(true);
//Le asigno el nuevo numero id
fila.attr("id",'t'+newID);
//AQUI SE ACCEDERÍA A LOS INPUTS PARA CAMBIAR IDS y VALORES
//PERO NO LO CONSIGO, ESTO NO FUNCIONA:
fila.children('td').eq(0).attr("id",'a'+newID).val('');
//Inserto nueva fila
$("#topera").append(fila);
}
Como véis, clono la fila, solo que no consigo modificar los ids y valores de los inputs, por lo que se clonan exactos.
Esperando vuestra ayuda,
muchas gracias por adelantado.
PD: tengo que hacerlo con clone, no me sirven soluciones insertando todo el código html completo.