473,320 Members | 2,164 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

Can you make them table insertRow and insertBefore (element) worktogether?

DL

Here's the thing, I have this HTML Table, that has multile rows
already, each has an ID, one of them at the bottom section has id of
"SaveData", new TRs are dynamically created upon user interaction, for
instance,
var tbl = document.getElementById ('mytable');
// pick a TR position to insert a new row
var trPos = 6
newTR = tbl.insertRow(trPos);

// then increment the trPos var
// other business rules and functions...

it works all right for a few TR insertions, and then, it begins to
insert a new TR after "SaveData",
that's bad. So, the question is, is there any way to use
tbl.insertRow(trPos) in conjunction with
insertBefore(document.getElementById('SaveData'))
that would ensure every newly inserted TR would be inserted before
"SaveData" TR?

I've looked at insertAdjacentElement method, but that does not seem to
solve the problem.

Sorry I have to ask the question before I got a good js book. Thanks.


Jun 27 '08 #1
3 3196
SAM
DL a écrit :
Here's the thing, I have this HTML Table, that has multile rows
already, each has an ID, one of them at the bottom section has id of
"SaveData", new TRs are dynamically created upon user interaction, for
instance,
var tbl = document.getElementById ('mytable');
// pick a TR position to insert a new row
var trPos = 6
newTR = tbl.insertRow(trPos);

// then increment the trPos var
// other business rules and functions...

it works all right for a few TR insertions, and then, it begins to
insert a new TR after "SaveData",
with which browser ?

a "few" ... how much ?
because I can't reproduce it ...
that's bad. So, the question is, is there any way to use
tbl.insertRow(trPos)
that would ensure every newly inserted TR would be inserted before
"SaveData" TR?
each of these 3 functions bellow add a row before the savedatas
(with my Firefox - not tested IE)

<html>
<script type="text/javascript">

function addRow() {
var tbl = document.getElementById ('mytable');
var newTR = tbl.insertRow(tbl.rows.length-1);
var newTD = document.createElement('TD');
newTD.innerHTML = 'test';
newTR.appendChild(newTD);
}

function addRow2() {
var tbl = document.getElementById ('mytable');
tbl = tbl.getElementsByTagName('TBODY')[0];
var newTR = tbl.insertRow(tbl.rows.length);
var newTD = document.createElement('TD');
newTD.innerHTML = 'test';
newTR.appendChild(newTD);
}

function addRow3() {
var tbl = document.getElementById ('mytable');
tbl = tbl.getElementsByTagName('TBODY')[0];
var newTR = tbl.appendChild(document.createElement('TR'));
var newTD = document.createElement('TD');
newTD.innerHTML = 'test';
newTR.appendChild(newTD);
}
</script>

<table id="mytable" border=1>
<thead>
<tr><th>...</th></tr>
</thead>
<tbody>
<tr><td>...</td></tr>
</tbody>
<tfoot>
<tr id="SaveData"><td>datas</td></tr>
</tfoot>
</table>
<p><a href="javascript:addRow();">add 1</a>
<p><a href="javascript:addRow2();">add 2</a>
<p><a href="javascript:addRow3();">add 3</a>
</html>
Jun 27 '08 #2
SAM
SAM a écrit :
>
each of these 3 functions bellow add a row before the savedatas
(with my Firefox - not tested IE)
and this forth one works fine too :

<html>
<script type="text/javascript">

function addRow4() {
var tbl = document.getElementById ('SaveData');
var newTR = document.createElement('TR');
var newTD = document.createElement('TD');
newTD.innerHTML = 'test';
newTR.appendChild(newTD);
tbl.parentNode.insertBefore(newTR, tbl);
}
</script>
<table id="mytable" border=1>
<thead>
<tr><th>...</th></tr>
</thead>
<tbody>
<tr><td>...</td></tr>
</tbody>
<tfoot>
<tr id="SaveData"><td>datas</td></tr>
</tfoot>
</table>
<p><a href="javascript:addRow4();">add 4</a>
</html>

--
sm
Jun 27 '08 #3
DL
On May 30, 10:56*pm, SAM <stephanemoriaux.NoAd...@wanadoo.fr.invalid>
wrote:
SAM a écrit :
...
>sm
Thanks, I'm testing with IE7, your syntax of tbl.rows.length gave me
an idea,
I've now solved this particular problem with a different approach than
yours.
Jun 27 '08 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

7
by: jon | last post by:
I'm trying to add a row to a table and I think I'm not doing something right. The sample code below contains a table with 4 single cell rows, a button and a javascript function that the button...
2
by: Asad | last post by:
I have a form on a page that has several textareas, and textboxes inside a table (so the table containing the textboxes is also inside the FORM tag). I want to replace the textareas with simple...
10
by: AdamG | last post by:
I am trying hard for days now to add and delete rows to a table. I could really use some help... Each row contains two buttons (images) - 'add row' and 'delete row'. When the user clicks add...
8
by: cool2005 | last post by:
I tried to dynamically add/clone a <tr> from an existing <tr> to a <table> but the problem is that I need to have a "onclick" event handler in the <tr>. I have tried following A. approach...
14
by: Stefan Mueller | last post by:
With the following code I can add a new row to an existing table. That really works great. Many thanks to all who helped me so far. But my problem is that the added cells do somehow not have the...
28
by: Giggle Girl | last post by:
Can someone show me how to insert a row at any given row index of an already created table? It only has to work in IE6 (used on intranet at work). Specifically, if a table is 20 rows in total...
6
by: Sundew Shin | last post by:
I think I can make a good interesting list of postings under this subject header, 'All browsers are cool but IE.' Anyway, the following code will show a table with an input box labeled, 'name',...
3
by: patrickkellogg | last post by:
I have this code when you click the buttom is suppose to add a job history. it works with firefox, opera, but not ie. (please note - new entries don't have all the elements in them yet, but...
3
by: sfeher | last post by:
Hi All, I'm creating a table using createElement / appendChild and everything works great. Ussualy I have no more than 20 rows and they contain less that 5 columns. Where my code starts to...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.