469,271 Members | 1,727 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,271 developers. It's quick & easy.

getting td value

Given the id of a tr, does anyone know how to get a value of a td of
that tr?
Jun 6 '06 #1
9 26908
turnitup wrote on 06 jun 2006 in comp.lang.javascript:
Given the id of a tr, does anyone know how to get a value of a td of
that tr?


<TD>s do not have a value.

========================================

<table><tr id=myTr><td>blah</td></tr></table>
<script type='text/javascript'>
var r = document.getElementById('myTr').firstChild.innerHT ML
alert(r)
</script>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Jun 6 '06 #2
Evertjan. wrote:
turnitup wrote on 06 jun 2006 in comp.lang.javascript:
Given the id of a tr, does anyone know how to get a value of a td of
that tr?


<TD>s do not have a value.

========================================

<table><tr id=myTr><td>blah</td></tr></table>
<script type='text/javascript'>
var r = document.getElementById('myTr').firstChild.innerHT ML
alert(r)
</script>


Thank you, of course I meant innerHTML!!
Jun 6 '06 #3
turnitup wrote:
Evertjan. wrote:
turnitup wrote on 06 jun 2006 in comp.lang.javascript:
Given the id of a tr, does anyone know how to get a value of a td of
that tr?


<TD>s do not have a value.

========================================

<table><tr id=myTr><td>blah</td></tr></table>
<script type='text/javascript'>
var r = document.getElementById('myTr').firstChild.innerHT ML
alert(r)
</script>


Thank you, of course I meant innerHTML!!


Here's a longer version which just uses the DOM:

var r = document.getElementById('myTr').firstChild.firstCh ild.data

The second "firstChild" is the text node within the tr element that
contains "blah".

--
Kam-Hung Soh
http://kamhungsoh.blogspot.com - It Mostly Works
http://members.optusnet.com.au/khsoh - Software That Mostly Works

Jun 7 '06 #4
Kam-Hung Soh wrote:
turnitup wrote:
Evertjan. wrote:
turnitup wrote on 06 jun 2006 in comp.lang.javascript:

Given the id of a tr, does anyone know how to get a value of a td of
that tr?
<TD>s do not have a value.

========================================

<table><tr id=myTr><td>blah</td></tr></table>
<script type='text/javascript'>
var r = document.getElementById('myTr').firstChild.innerHT ML


That method is dependent on the markup in some browsers. If whitespace
is introduced between the TR and TD tags (e.g. <tr ...> <td>...), then
the TR's first child will be a #text node, not the TD in Firefox and I
think other Gecko browsers too.

A better idea is to use the cells collection:

var tr = document.getElementById('myTr');
var td = tr.cells[0];

From memory, Safari 1.0.3 (Mac OS X 10.2) does not properly implement
the table row's cells collection - if that's an issue, you can use
getElementsByTagName:

var td = tr.getElementsByTagName('td')[0];

A final method is to walk down the child nodes until a TD is encountered:

var td = tr.firstChild;
while (td && 'td' != td.tagName.toLowerCase() ){
td = td.nextSibling;
}

If there are no TDs in the row, td will be undefined but then the HTML
would be invalid in the first place.

I think that about covers the reasonable methods, take your pick.
[...]

--
Rob
Jun 7 '06 #5
RobG wrote on 07 jun 2006 in comp.lang.javascript:
Kam-Hung Soh wrote:
No, you left Kam-Hung's relay out of your quote!
turnitup wrote:
Evertjan. wrote:
turnitup wrote on 06 jun 2006 in comp.lang.javascript:

> Given the id of a tr, does anyone know how to get a value of a td
> of that tr?
<TD>s do not have a value.

========================================

<table><tr id=myTr><td>blah</td></tr></table>
<script type='text/javascript'>
var r = document.getElementById('myTr').firstChild.innerHT ML


That method is dependent on the markup in some browsers. If
whitespace is introduced between the TR and TD tags (e.g. <tr ...>
<td>...), then the TR's first child will be a #text node, not the TD
in Firefox and I think other Gecko browsers too.


Your below ideas are better indeed.
A better idea is to use the cells collection:

var tr = document.getElementById('myTr');
var td = tr.cells[0];

From memory, Safari 1.0.3 (Mac OS X 10.2) does not properly implement
the table row's cells collection - if that's an issue, you can use
getElementsByTagName:

var td = tr.getElementsByTagName('td')[0];

A final method is to walk down the child nodes until a TD is
encountered:

var td = tr.firstChild;
while (td && 'td' != td.tagName.toLowerCase() ){
td = td.nextSibling;
}

If there are no TDs in the row, td will be undefined but then the HTML
would be invalid in the first place.

I think that about covers the reasonable methods, take your pick.


Since the page's HTML is your own,
why not simply ensure there is no white space?

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Jun 7 '06 #6
Evertjan. wrote:

Since the page's HTML is your own,
why not simply ensure there is no white space?


The OP can do that, but I think it creates a maintenance issue - if at
any time in the future the HTML is modified, it is quite possible that
whitespace will be introduced.

Thinking on it a little more, I think a span with an ID should be used
and the date string written to that using getElementById. It means the
span can be put anywhere in the document and removes issues related to
wandering down the DOM tree, such as the different treatment of
whitespace by various browsers and extra elements being introduced (say
the date gets moved to the second cell, or a table-less layout is
adopted). :-)
--
Rob
Jun 7 '06 #7
RobG wrote:
The OP can do that, but I think it creates a maintenance issue - if at
any time in the future the HTML is modified, it is quite possible that
whitespace will be introduced.

Thinking on it a little more, I think a span with an ID should be used
and the date string written to that using getElementById. It means the
span can be put anywhere in the document and removes issues related to
wandering down the DOM tree, such as the different treatment of
whitespace by various browsers and extra elements being introduced (say
the date gets moved to the second cell, or a table-less layout is
adopted). :-)


I think it's a neat idea! It separates the content (so to speak) from
the markup.

I can feel a design pattern coming on ....

--
Kam-Hung Soh
http://kamhungsoh.blogspot.com - It Mostly Works
http://members.optusnet.com.au/khsoh - Software That Mostly Works

Jun 8 '06 #8
Kam-Hung Soh wrote on 08 jun 2006 in comp.lang.javascript:
RobG wrote:

[..]

Thinking on it a little more, I think a span with an ID should be
used and the date string written to that using getElementById. It
means the span can be put anywhere in the document and removes issues
related to wandering down the DOM tree, such as the different
treatment of whitespace by various browsers and extra elements being
introduced (say the date gets moved to the second cell, or a
table-less layout is adopted). :-)


I think it's a neat idea! It separates the content (so to speak) from
the markup.

I can feel a design pattern coming on ....


In practice, you build all large tables needing the wanted features by
serverside code, so that having each element id-ed and css-classed is
defaultly incorporated. Most features can then be css and javascript
driven.

Would you call that a design pattern?

ASP-VBS example:

<% newTable "myTable" %>
<% newHeadRow %>
<% newCell "cell content 7" %>
<% newCell defaultCellContent %>
<% newBodyRow %>
<% newCell defaultCellContent %>
<% newCell "cell content 777" %>
<% endTable %>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Jun 8 '06 #9
Evertjan. wrote:
In practice, you build all large tables needing the wanted features by
serverside code, so that having each element id-ed and css-classed is
defaultly incorporated. Most features can then be css and javascript
driven.

Would you call that a design pattern?

ASP-VBS example:

<% newTable "myTable" %>
<% newHeadRow %>
<% newCell "cell content 7" %>
<% newCell defaultCellContent %>
<% newBodyRow %>
<% newCell defaultCellContent %>
<% newCell "cell content 777" %>
<% endTable %>


Yes, I agree.

I was thinking of AJAX or Javascript-driven pages in my previous post.
Sorry for not stating the context.

--
Kam-Hung Soh
http://kamhungsoh.blogspot.com - It Mostly Works
http://members.optusnet.com.au/khsoh - Software That Mostly Works

Jun 9 '06 #10

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

6 posts views Thread by melanieab | last post: by
4 posts views Thread by bushi | last post: by
33 posts views Thread by JamesB | last post: by
10 posts views Thread by Mike | last post: by
reply views Thread by buntyindia | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.