The table has two rows and i want to be able to add and remove cells, up to three for each row.
I have managed to add elements pretty well so far using that code
Code: Select all
<table id = "areas" border="0" width="98%" height="50">
<tr id = "row1">
</tr>
<tr id = "row2">
</tr>
</table>Code: Select all
function addAreaToTable(text,value){
var row1 = document.getElementById("row1");
var row2 = document.getElementById("row2");
if(row1has<3){
var cell = document.createElement("td");
cell.setAttribute('id',text);
cell.innerHTML = '<a href="javascript: removeAreaFromTable('+cell.id+')">'+text+'</a>';
row1has = row1has + 1;
row1.appendChild(cell);
}
else if(row2has<3){
var cell = document.createElement("td");
cell.setAttribute('id',text);
cell.innerHTML = '<a href="javascript: removeAreaFromTable('+cell.id+')">'+text+'</a>';
row2has = row2has + 1;
row2.appendChild(cell);
}
else{
alert("No more than 6 areas");
}
}Code: Select all
function removeAreaFromTable(id){
alert(id);
var cell = document.getElementById(id);
var row = cell.parentElement;
alert(row.id);
row.removeChild(cell);
}thanks