Script
var opt = document;
function inserirLinha(id) {
var newRow = opt.createElement('tr');
newRow.insertCell(0).innerHTML = '<input type="button" value="X" onclick="removeLinha(this)" />';
newRow.insertCell(1).innerHTML = 'REMOVER';
newRow.insertCell(2).innerHTML = 'A LINHA';
opt.getElementById(id).appendChild(newRow);
return false;
}
function removeLinha(id) {
var apagar = opt.getElementsByTagName(id);
apagar.parentNode.parentNode.removeChild(apagar.parentNode);
}
<center>
<form onsubmit="return inserirLinha('minhaTabela')">
<table>
<tr>
<tbody id="minhaTabela"></tbody>
</tr>
</table>
<input type="submit" value="Adicionar" name="submit">
</form>
</center>
The above script has two distinct functions, one of which is inserirLinha
which includes a new line in the already predefined HTML table, but the removeLinha
function is not fulfilling its role, why?
In the console of the browser, it complains:
TypeError: delete is null
Debbuger points to:
apagar.parentNode.parentNode.removeChild(apagar.parentNode);
A problem that little shows me what to solve.