?
Solved

How to read value from a TH in HTML table with Javascript (NO JQuery, if possible)

Posted on 2016-09-22
3
Medium Priority
?
79 Views
Last Modified: 2016-11-03
I'm trying to get the value from a table (I have no control over this format or naming) and I'd like to grab the value of "Opened Account" in the example below but not sure how to go about it? I'm trying to target "th.rich-table-headercell" but not sure how to grab value?

<table class="rich-table home table" id="startForm:OpenedReviewApps" border="1" cellpadding="0" cellspacing="0">
     <colgroup span="0"></colgroup>
     <thead class="rich-table-thead">
         <tr class="rich-table-header">
             <th class="rich-table-headercell" scope="colgroup">Opened Accounts
             </th>
         </tr>
    </thead>
   <tbody id="startForm:OpenedReviewApps:tb">
        <tr class="rich-table-row rich-table-firstrow">
            <td class="rich-table-cell" id="startForm:Open" style="width:80%"> some data here
            </td>
        </tr> 
    </tbody> 
</table>

Open in new window

0
Comment
Question by:894359
  • 2
3 Comments
 
LVL 56

Expert Comment

by:Ryan Chong
ID: 41811775
you can try use document.getElementById, like:
<script language="javascript">
    var v = document.getElementById("startForm:Open").innerText;
    alert("Your var = " + v);
</script>

Open in new window

0
 

Author Comment

by:894359
ID: 41811779
Hi Ryan,
there is no "id" on the "th" I'm trying to read:

<th class="rich-table-headercell" scope="colgroup">Opened Accounts</th>

Thanks
0
 
LVL 56

Accepted Solution

by:
Ryan Chong earned 2000 total points
ID: 41811789
ooops, miss understood your question, perhaps you can try this instead:

<script language="javascript">
    var ths = document.getElementsByTagName("th");
    for (var i = 0; i < ths.length; i++) {
        if ((ths[i].getAttribute("class") == "rich-table-headercell") && (ths[i].getAttribute("scope") == "colgroup")) {
            var v = ths[i].innerText;
            break;
        }
    }
    alert("Your var = " + v);
</script>

Open in new window

0

Featured Post

Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
Suggested Courses

607 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question