From looking at your code it looks like your function adds a row onto an existing table.
You're using DOM functions to get the data out of the table, but then using innerHTML to put it all back.
Can't you just use the DOM functions (appendChild(), etc.) to add the new row on without having to mess with what's already there? Would probably make the code a lot simpler too.
function addPubFn(pubID, pubName, pubPostcode)
{
var tbody = document.getElementById('publist3').getElementsByTagName('tbody')[0];
//if table full, exit fn
if (tbody.rows.length >= 10) { return false;}
// if pubID is in the table, exit
for (var i = 0; i < tbody.rows.length; i++)
{
if (tbody.getElementsByTagName('tr')[i].getElementsByTagName('td')[0].firstChild.nodeValue == pubID)
{
return false;
}
}
// Create the new row
var newRow = document.createElement('tr');
newRow.onclick = function() { thisRow(this);};
var cell1 = document.createElement('td');
cell1.appendChild(document.createTextNode(pubID));
var cell2 = document.createElement('td');
cell2.appendChild(document.createTextNode(pubName));
var cell3 = document.createElement('td');
cell3.appendChild(document.createTextNode(pubPostcode));
newRow.appendChild(cell1);
newRow.appendChild(cell2);
newRow.appendChild(cell3);
// Add it to the table
tbody.appendChild(newRow);
return false;
}
thanks for that chopsta but unfortunateley i already tried it that way.
using innerhtml was a last resort as it was the only way i could attach the event to the table rows. i tried using addeventlistener and addevent but they don't allow you to pass parameters to a function. onclick didn't work for me either.