FRIHOST • FORUMS • SEARCH • FAQ • TOS • BLOGS • DIRECTORY
You are invited to Log in or Register a Frihost Account!

rows in a table

   Frihost Forum Index -> Scripting -> Html, CSS and Javascript
 


merrik
I'm playing around with js and I made a stopwatch, now I want to add the lap functionality and to do so I want add a row in the end of the table and the two cells, in the cell in the right side I want add the time ... really simple.
I know how to add the row and the cells, but I can't figure out how to add the row in the end of the table, not in the begining, the code that I have bellow works only, but only, when I have one row, if I add a second row to write any kind of information it is not going work, any ideas?

The code:
Code:
<html>
<head>
  <title>Stopwatch</title>
  <script type="text/javascript">
    var stopwatch;
    var min = 0;
    var sec = 0;
    var cent = 0;
    var numrows = 0;

    function start() {
      cent += 1;

      if( cent == 100 ) {
        sec++;
        cent = 0;
      }

      if( sec == 60 ) {
        min++;
        sec = 0;
      }

      stopwatch = setTimeout("start()", 10);
      document.getElementById('display').innerHTML = min + ":" + sec + "." + cent;
      numrows = document.getElementById('table').rows().lenght;

    }

    function changestt() {
      if( document.getElementById('state').value == "Lap" ) {
   numrows++
        var newrow = document.getElementById('table').insertRow(numrows);
        var cell1 = newrow.insertCell(0);
        var cell2 = newrow.insertCell(1);
   cell1.innerHTML = numrows;
   cell2.innerHTML = min + ":" + sec + "." + cent;
      }

      else {
        document.getElementById('state').value = "Lap";
        start();
      }
    }

    function clock_reset() {
      clearTimeout( stopwatch );
      min = 0;
      sec = 0;
      cent = 0;
      document.getElementById('display').innerHTML = min + ":" + sec + "." + cent;
      document.getElementById('state').value = "Start"
    }
  </script>
</head>

<body>
  <table id="table" width="50%">
    <tr>
      <td>
        <p id="display">0:0.0</p>
        <input type="button" value="Start" id="state" onclick="changestt()" />
        <input type="button" value="Reset" onclick="clock_reset()" />
      </td>
      <td></td>
    <tr>
</table>
</body>
</html>
piygoy
Hi,
Try to loop the table, i. e. insert an outer table, in which you can add the row.

<table>
<tr><td>
<table><tr><td></td></tr></table>
</td></tr>
</table>
Related topics

list number of rows in a table
HTML tables with irregular rows and/or columns
Using <DIV> and <TABLE> both in a layout
Adding blank rows
PHP Help entering values from a text form into a table
Calculating number of rows
Querying random rows . Optimization!?!?
Deleting duplicate rows in mysql
select x random rows from database
Zero space between table rows
Force table size?
Table menu
script backup database
[ java scripts ] email service
Okay, I'm done trying to use CSS for layout.
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2007 Frihost, forums powered by phpBB.