Hi.
I've got an example.
Here's the code:
<html>
<head>
<title>Example</title>
<script language="javascript">
function Remove(){
var tbody = document.getElementById("tbl").firstChild;
if(tbody.childNodes.length <= 1)
{
alert('There are no regists!');
return;
}
var tr = tbody.lastChild;
tbody.removeChild(tr);
}
function Insere(){
var tbody=document.getElementById("tbl").firstChild;
var newTR = document.createElement("tr");
var newTD1 = document.createElement("td");
var newTD2 = document.createElement("td");
var newText1 = document.createTextNode(document.cart.primNome.val ue);
var newText2 = document.createTextNode(document.cart.ultNome.valu e);
newTD1.appendChild(newText1);
newTD2.appendChild(newText2);
newTR.appendChild(newTD1);
newTR.appendChild(newTD2);
tbody.appendChild(newTR);
}
</script>
</head>
<body id="bodyTag">
<button onclick="Remove()" id=button1 name=button1>Remover</button>
<button onclick="Insere()" id=button2 name=button2>Adicionar</button>
<form id="cart" name=cart>
1º Nome: <input type=text id=primNome name="primNome">
<br>Último nome: <input type=text id=ultNome name="ultNome">
</form>
<table id=tbl bgcolor=#ffffff>
<tr bgcolor=#ccccff>
<th>1º Nome</td>
<th>Último nome</td>
</tr>
</table>
</body>
</html>
There are words in Portuguese sorry but i don't want to change.
This simple form accepts the first and the last name, and then creates a
<tr> with 2 <tr> for show the values.
Hope this helps.
"El Diablo" <ze*****@zen.co.uk> escreveu na mensagem
news:40**********************@lovejoy.zen.co.uk...
Hi there,
I'm trying dynamically generate extra rows in a table. So far this
achieves this task within the tHead segment:
theTable.tHead.appendChild(document.createElement( 'TR'))
...but this only gives me table rows with no table data cells. So I would
like to know if it's possible to create several <TH> within the tHead row
using this method?
I'm new to DOM manipulation so any information or pointers would be
greatly appreciated.
- Thanks.
