...

View Full Version : Cell Coordinates & InnerText



AshtonHogan
08-27-2009, 02:09 PM
Hi,

I would like to SET input areas with cell data. The problem I'm having, however, is that I cannot find a way to get a specific cell's content.

I would like something like this:



var x=1;
var y=2;
inputArea ABC = document.getElementById("MYTABLE")[x][y].innerText;


I've been searching for hours on this, if someone could help I'd really appreciate it!

Thanks a lot,
Ashton.

tomws
08-27-2009, 03:04 PM
You haven't mentioned anything about a specific JavaScript framework, so I'm not sure why you selected this subforum. You may want to ask a moderator to move it up to the top-level JavaScript forum so you get more responses.

Try assigning a location-specific ID to each cell and then using getElementById to find it. Something like this:

<!-- IDs must start with a letter or underscore -->
<table>
<tr>
<td id="_0x0">a</td><td id="_0x1">b</td><td id="_0x2">c</td>
<tr>
<tr>
<td id="_1x0">d</td><td id="_1x1">e</td><td id="_1x2">f</td>
<tr>
<tr>
<td id="_2x0">g</td><td id="_2x1">h</td><td id="_2x2">i</td>
<tr>
</table>


Something like this would be easy to generate programmatically, and since IDs are related to location, the desired cell location should be easy to find.

AshtonHogan
08-27-2009, 04:30 PM
You see, I cannot set Id's because the table rows are dynamically generated and there will be an X amount. Is there no way of doing something similar to the line of code I mentioned above?



inputArea ABC = document.getElementById("MYTABLE")[x][y].innerText;


I would prefer not to generate table row id's for every single row while it's being generated...

tomws
08-27-2009, 05:27 PM
You see, I cannot set Id's because the table rows are dynamically generated and there will be an X amount.
Of course you can - and exactly because it's being generated dynamically.


Is there no way of doing something similar to the line of code I mentioned above?



inputArea ABC = document.getElementById("MYTABLE")[x][y].innerText;



I was going to say no, but I had a look around the web and found something you might try:

/*edit me to fit your needs*/
document.getElementById('rt').rows[1].cells[0]

No idea if it'll work - never tried it or had any use for it myself. If not, you'll need to look at walking the document, I think. Have a look around for parentNode, childNodes, getElementsByTagName - all dumped into some nice loops, too.

AshtonHogan
08-27-2009, 05:30 PM
Nevermind, I found the solution:



<html>
<head><title></title></head>
<body>
<script type="text/javascript">
function getRow(t) {
var col=t.cellIndex;
var row=t.parentNode.rowIndex;
var testTable = document.getElementById("testTable");
alert(testTable.rows[row].cells[col].innerHTML);
}
</script>

<table id="testTable" border='1' style="background-color:black; color:white">
<tr>
<td width='150px' onclick="getRow(this)">
test 1
</td>
<td onclick="getRow(this)">
<b>Test B</b>
</td>
</tr>
<tr>
<td width='150px' onclick="getRow(this)">
test 2
</td>
<td onclick="getRow(this)">
<b>Test B</b>
</td>
</tr>
</table>
</body>
</html>


My only question now is:
Is there a better way to retrieve cell data than innerHTML ? I tried "data" but it returns "[object]"... When I use innerHTML it returns the html tags, along with the text, and I only want the text...

Thanks.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum