Una consulta, quisiera saber como puedo agregar una fila de campos de texto de una tabla al presionar un botón.
Aquí el código html de la tabla.
<table class="table-condensed table-responsive table-hover" id="row0">
<tr>
<th class="btn-info">Origen</th>
<th class="btn-info">Destino</th>
<th class="btn-info">Iata</th>
<th class="btn-info">Vuelo</th>
<th class="btn-info">Fecha</th>
<th class="btn-info">Piezas</th>
<th class="btn-info">Peso</th>
<th class="btn-info">Volumen</th>
<th class="btn-info">Acción</th>
</tr>
<tr>
<td>
</td>
</tr>
</table>
<input type="button" name="btnaddrow" class="btn-primary" value="+" onclick="addRow('row0');">
<input type="button" name="btndelete" class="btn-danger"value="-" onclick="deleteRow('row0');">
Aquí el Código javascript del archivo js "tablaDinamica".
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
var element2 = document.createElement("input");
element1.type = "checkbox";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.createElement("input");
element2.type = "text";
cell2.appendChild(element2);
}
function deleteRow(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
El Código funciona bien , el problema es que solo me agrega un campo de texto y descuadrado de la tabla, y quisiera saber como puedo agregar una fila completa de campos input en la tabla al presionar el botón "+" y lo mismo cuan do presiono el botón "-" para eliminar la fila.
acá la imagen de como agrega la fila.