easyrider439
asked on
add new rows with number of row in 1st colum
I'm sure this question has been asked allot and I've tried to look through previous articles but i'm looking to add new rows to a table and in the first column (cell) I want it to display what number that row is, below is what i have and it just displays #3 in each row. I hope this makes sense. Thanks guys.
function addRow(divname)
{
var totalrows = document.getElementById('invoice').rows.length-1;
var product = '<?php echo $products; ?>';
var newdiv = document.createElement('<tr>');
newdiv.innerHTML = "<td><strong>" + (totalrows + 1) + "</strong></td><td><div class='field'><select name='product[]' id='product'><option selected='selected'></option>" + product + "</select></td>";
document.getElementById(divname).appendChild(newdiv);
}
hi,
this seams to work
this seams to work
function addRow(divname)
{
var totalrows = document.getElementById('invoice').rows.length-1;
var product = 'xxx';
var newdiv = document.createElement('tr');
newdiv.innerHTML = "<td><strong>" + (totalrows + 1) + "</strong></td><td><div class='field'><select name='product[]' id='product'><option selected='selected'>" + product + "</option></select></td>";
document.getElementById(divname).appendChild(newdiv);
}
oops :)
replace xxx
width <?php echo $products; ?>
replace xxx
width <?php echo $products; ?>
if you need to start with 1 instead of 0
var totalrows = document.getElementById('i nvoice').r ows.length -1;
should be
var totalrows = document.getElementById('i nvoice').r ows.length ;
var totalrows = document.getElementById('i
should be
var totalrows = document.getElementById('i
ASKER
using your method doesnt add up the rows it displays the following:
<table>
1 text here
4 text here
4 text here
and I want it too display as follows:
1 text here
2 text here
3 text here
4 text here
hope that makes sence
<table>
1 text here
4 text here
4 text here
and I want it too display as follows:
1 text here
2 text here
3 text here
4 text here
hope that makes sence
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Some notes:
//the divname refers to a "Table" object or a "DIV" object??
function addRow(divname)
{
///what is the "invoice" element?? (table, div) it refers to the same "divname" parameter ???
var totalrows = document.getElementById('i nvoice').r ows.length -1;
///totalrows does not change length if it's not the "divname" object
var product = 'xxx';
var newdiv = document.createElement('tr ');
newdiv.innerHTML = "<td><strong>" + (totalrows + 1) + "</strong></td><td><div class='field'><select name='product[]' id='product'><option selected='selected'>" + product + "</option></select></td>";
// the row is added to the divname element (and maybe it should be the same "invoice" element)
document.getElementById(di vname).app endChild(n ewdiv);
}
so i guess the right code is:
function addRow(divname)
{
//note the "divname" parameter
var totalrows = document.getElementById(di vname).row s.length+1 ;
var product = '<?php echo $products; ?>';
var newdiv = document.createElement('<t r>');
newdiv.innerHTML = "<td><strong>" + (totalrows + 1) + "</strong></td><td><div class='field'><select name='product[]' id='product'><option selected='selected'></opti on>" + product + "</select></td>";
document.getElementById(di vname).app endChild(n ewdiv);
}
//the divname refers to a "Table" object or a "DIV" object??
function addRow(divname)
{
///what is the "invoice" element?? (table, div) it refers to the same "divname" parameter ???
var totalrows = document.getElementById('i
///totalrows does not change length if it's not the "divname" object
var product = 'xxx';
var newdiv = document.createElement('tr
newdiv.innerHTML = "<td><strong>" + (totalrows + 1) + "</strong></td><td><div class='field'><select name='product[]' id='product'><option selected='selected'>" + product + "</option></select></td>";
// the row is added to the divname element (and maybe it should be the same "invoice" element)
document.getElementById(di
}
so i guess the right code is:
function addRow(divname)
{
//note the "divname" parameter
var totalrows = document.getElementById(di
var product = '<?php echo $products; ?>';
var newdiv = document.createElement('<t
newdiv.innerHTML = "<td><strong>" + (totalrows + 1) + "</strong></td><td><div class='field'><select name='product[]' id='product'><option selected='selected'></opti
document.getElementById(di
}
ASKER
beautiful, it works thanks guys
elementNode.insertBefore(n
using the first child node as a reference node
....
document.getElementById(di