How to get the data of a table from the first to the last row with a JavaScript

S

Stefan Mueller

I have a table dynamically created with a JavaScript (insertRow, deleteRow).
At the end I'd like to go through the whole table (beginning at the first
and ending at the last row) to display all the data e.g. with alert().
Is there an easy way to go through the whole table to read the data (each
row has an unique ID but I don't know their IDs) or do I need while
modifying the table to rememder each row's ID so I can access to data
directly with their IDs?

Stefan
 
R

RobG

Stefan said:
I have a table dynamically created with a JavaScript (insertRow, deleteRow).
At the end I'd like to go through the whole table (beginning at the first
and ending at the last row) to display all the data e.g. with alert().
Is there an easy way to go through the whole table to read the data (each
row has an unique ID but I don't know their IDs) or do I need while
modifying the table to rememder each row's ID so I can access to data
directly with their IDs?

Presumably you have a reference to the table. I'm not sure it's wise to
blast it all into an alert, there's a good chance you can't see it all.

The following just requires a reference to the table, nothing more (oh,
and support for the rows and cells collections):

function showTableContent(theTable)
{
var content=[];
var row, cell;
if (!theTable.rows || !theTable.rows[0].cells) return;
for (var i=0, rlen=theTable.rows.length; i<rlen; ++i){
row = theTable.rows;
for (var j=0, clen=row.cells.length; j<clen; ++j){
content.push('row ' + i +' cell ' + j + ': '
+ getElText(row.cells[j]));
}
}
alert(content.join('\n'));
}

function getElText(el)
{
if (el.textContent) return el.textContent;
if (el.innerText) return el.innerText;
var x = el.childNodes;
var txt = '';
for (var i=0, len=x.length; i<len; ++i){
if (3 == x.nodeType) {
txt += x.data;
} else if (1 == x.nodeType){
txt += getElText(x);
}
}
return txt.replace(/\s+/g,' ');
}
 
S

Stefan Mueller

Great, I really get the number of rows of the table 'MyTable' which is
located on the second frame
var table = parent.frames[1].document.getElementById("MyTable")
alert (table.rows.length)

The number of cells in the row 'i' I get with
alert (table.rows.cells.length)

The information about my hidden text fields (e.g. <input id="MyRow_0"
name="MyRow_0" type="hidden">) which are located in the table (only one
column -> cells[0]) I get with
alert (table.rows.cells[0].innerHTML)

But how can I read the content of my hidden text fields?

The following command shows only an empty alert box
alert (table.rows.cells[0].textContent)
and
alert (table.rows.cells[0].innerText)
says 'undefined'.

Stefan
 
R

RobG

Stefan said:
Great, I really get the number of rows of the table 'MyTable' which is
located on the second frame
var table = parent.frames[1].document.getElementById("MyTable")
alert (table.rows.length)

The number of cells in the row 'i' I get with
alert (table.rows.cells.length)

The information about my hidden text fields (e.g. <input id="MyRow_0"
name="MyRow_0" type="hidden">) which are located in the table (only one
column -> cells[0]) I get with
alert (table.rows.cells[0].innerHTML)

But how can I read the content of my hidden text fields?

The following command shows only an empty alert box
alert (table.rows.cells[0].textContent)
and
alert (table.rows.cells[0].innerText)
says 'undefined'.


Then you need a modified 'getElText' function, you may need to add logic
to deal with other element types and the various elements within each:


function getElText(el)
{
var x, nodes = el.childNodes;
var txt = '';
for (var i=0, len=nodes.length; i<len; ++i){
x = nodes
if (3 == x.nodeType) {
txt += x.data;
} else if (1 == x.nodeType){
if ('input' == x.nodeName.toLowerCase()){
txt += x.value;
} else {
txt += getElText(x);
}
}
}
return txt;
}



Interface Node - node types
Element types:
ELEMENT_NODE = 1
ATTRIBUTE_NODE = 2
TEXT_NODE = 3
CDATA_SECTION_NODE = 4
ENTITY_REFERENCE_NODE = 5
ENTITY_NODE = 6
PROCESSING_INSTRUCTION_NODE = 7
COMMENT_NODE = 8
DOCUMENT_NODE = 9
DOCUMENT_TYPE_NODE = 10
DOCUMENT_FRAGMENT_NODE = 11
NOTATION_NODE = 12
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top