Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Dec 2004
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How To: Counting Number of Rows in a Table

    Hello Everyone,

    Let me began by saying I am not a program nor do I have any clue of programming.

    I am creating a website (my first), the web site has a table, I would like to be able to write a function (or something) to count the number of rows in the table, I don't know how to do it, any help is appreciated.

    thank you

    Aravot

  • #2
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    easiest way is to get all of the elements with the name tr.

    Code:
    function CountRows(){
      var theTRs = document.getElementsByTagName("tr");
      alert(theTRs.length);
    }
    One problem with this is if you have multiple tables on the page.

    Eric
    Last edited by A1ien51; 12-09-2004 at 09:47 PM.
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #3
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    <input type="button" value="Alert Rows"
    onclick="alert(document.getElementsByTagName('table')[0].getElementsByTagName('tr').length)">

  • #4
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    That wouldn't take into consideration the table headers though, if you want to count those too, you can do:

    Code:
    <script type="text/javascript">
    
    function countRows()
    {
    	var rows=document.getElementsByTagName('table')[1].rows.length;
    	alert(rows);
    }
    
    </script>
    Basscyst
    Helping to build a bigger box. - Adam Matthews

  • #5
    New to the CF scene
    Join Date
    Dec 2004
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks A1ien51,

    That worked, but instead of a window pop up I want to show it on the page, like this

    “Number of Rows 5”, and don't want to count table header, this is what I have please correct me.

    <script language="JavaScript">
    function getNumberOfRows(){

    var theTRs = document.getElementsByTagName("tr");
    alert(theTRs.length);

    }//end function
    .
    .
    .
    .
    </script>

    <script language="JavaScript">
    show=getNumberOfRows();
    document.getElementsByTagName("<div align=center><h3>Total Rows "+ show +" </h3></div>");

    </script>

  • #6
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Basscyst
    That wouldn't take into consideration the table headers though, if you want to count those too, you can do:

    Code:
    <script type="text/javascript">
    
    function countRows()
    {
    	var rows=document.getElementsByTagName('table')[1].rows.length;
    	alert(rows);
    }
    
    </script>
    Basscyst
    What do you mean??

    My example would not be affected by table headers...
    although it would be affected if there are more than one table on the page, but that could easily be accounted for...

    However: alert(document.getElementsByTagName('tr').length)
    Would also return the number of table rows on the page but again, irregardless if there were more than one table on the page (my first example provides room for targetting the correct table by adjusting its place in the array)

    Additionally, table.rows.length is not supported by all browsers...

    .....Willy

  • #7
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    well, when I make a table, I go. . .

    Code:
    <table>
     <thead>
      <th>My Header</th>
     </thead>
     <tr>
      <td>Row 1</td>
     </tr>
    </table>
    Maybe I'm doing it wrong. Should there be a <tr> after the <thead>? That's why I say it wouldn't pick up the header. Didn't know about the cross browser support.

    Basscyst
    Helping to build a bigger box. - Adam Matthews

  • #8
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Off hand I forget which browsers support table.rows but I believe it is an IE only method...

    As for the table header I think we are looking at apples and oranges... You are correct that the th would add a row but I was only looking at what the poster asked for and that was the number of tr's...

    I apologize for any confusion;
    .....Willy


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •