passing id problem

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
sarris
Forum Contributor
Posts: 137
Joined: Mon Dec 04, 2006 2:44 pm

passing id problem

Post by sarris »

hi there. i am trying to create a semi dynamic table.
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");
	}	
}
the problem i have is at removing the cells

Code: Select all

function removeAreaFromTable(id){
	alert(id);
	var cell = document.getElementById(id);
	var row = cell.parentElement;
	alert(row.id);
	row.removeChild(cell);
}
i dont know if this is going to work, but so far the problem is that the alert instead of showing the id of the cell element (which is the "text" parameter passed at the addAreaToTable function) it shows [object HTMLTableCellElement]. That looks weird to me as when i have the mouse over the content of the cell, the status bar below on the page shows "javascript : removeAreaFromTable(areaname)" , as it is passing the name regurarly...any ideas?
thanks
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

You should probably be using row.getAttribute('id')
sarris
Forum Contributor
Posts: 137
Joined: Mon Dec 04, 2006 2:44 pm

Post by sarris »

i managed to pass the id in the end...
now i think i am having a problem with getting the parent of the cell

the alert in that case shows the id of the cell (just to confirm that everything is passed ok)

Code: Select all

function removeAreaFromTable(id){
	var cell = document.getElementById(id);
	var row = cell.parentElement;
                alert(cell.getAttribute("id"));
	row.removeChild(cell);
}
the alert in that case, when trying to show the id of the row, doesnt show at all. and off course the child is not removed.

Code: Select all

function removeAreaFromTable(id){
	var cell = document.getElementById(id);
	var row = cell.parentElement;
                alert(row.getAttribute("id"));
	row.removeChild(cell);
}
sarris
Forum Contributor
Posts: 137
Joined: Mon Dec 04, 2006 2:44 pm

Post by sarris »

aaahh...forget it.sorry to bother...i needed to have parentNode instead of parentElement.
Post Reply