javascript onclick html5
I am using forms as my navigation so i can get the amount of time spent on pages as they browse through the training materials. I used this for test pages where there was one form on the page and it passed the time correctly. Now i cannot seem to get the elapsedTime to pass, and i echo it out to see if it's going through and i get nothing so while the form is going to the passthru page it is not submitting the time.
<?php
session_start();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width; height=device-height; initial-scale=1;">
<title>Digital Natives Testing Module</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
<!--[if IE]>
<style type="text/css">
.clear {
zoom: 1;
display: block;
}
</style>
<![endif]-->
</head>
<script>
var currentTime = new Date();
var startTime = currentTime.getTime();
function getElapsedTime()
{
var endTime = new Date();
var elapsedTime = ((endTime.getTime() - startTime) / 1000);
form1.elapsedTime.value = elapsedTime;
}
</script>
<body>
<section id="page"> <!-- Defining the #page section with the section tag -->
<div class="header"> <!-- Defining the header section of the page with the appropriate tag -->
<h1>Test A</h1>
<p> </p>
<nav> <!-- The nav link semantically marks your main site navigation -->
<ul>
<li>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<form name="form1" id="training" method="post" action="doTrainingInsert.php">
<input type="hidden" name="elapsedTime" />
<button type="submit" name="submitAoverheat" onclick="getElapsedTime()">OVERHEAT</button>
</form>
</td>
<td>
<form name="form1" id="training" method="post" action="doTrainingInsert.php">
<input type="hidden" name="elapsedTime" />
<button type="submit" name="submitAjammed" onclick="getElapsedTime()">JAMMED</button></form>
</form>
</td>
<td>
<form name="form1" id="training" method="post" action="doTrainingInsert.php">
<input type="hidden" name="elapsedTime" />
<button type="submit" name="submitAcontinue" onclick="getElapsedTime()">CONTINUE</button></form>
</form>
</td>
<td>
<form name="form1" id="training" method="post" action="doTrainingInsert.php">
<input type="hidden" name="elapsedTime" />
<button type="submit" name="submitAstop" onclick="getElapsedTime()">STOP</button></form>
</form>
</td>
<td>
<form name="form1" id="training" method="post" action="doTrainingInsert.php">
<input type="hidden" name="elapsedTime" />
<button type="submit" name="submitAfinished" onclick="getElapsedTime()">FINISHED</button></form>
</form>
</td>
</tr>
</table>
</li>
</ul>
</nav>
</div>
<section id="articles"> <!-- A new section with the articles -->
<!-- Article 1 start -->
<div class="line"></div> <!-- Dividing line -->
<div class="article" id="article1"> <!-- The new article tag. The id is supplied so it can be scrolled into view. -->
<h2>overheat</h2>
<div class="line"></div>
<div class="articleBody clear">
<div class="figure"> <!-- The figure tag marks data (usually an image) that is part of the article -->
<img src="img/a_overheat.png" alt="overheat" />
</div>
<p>If the machine is producing too rapidly, it may result in overheating. When the machine displays a square, this indicates that it is overheating and needs to be slowed down.</p>
</div>
</div>
<!-- Article 1 end -->
</section>
<footer> <!-- Marking the footer section -->
<div class="line"></div>
</footer>
</section> <!-- Closing the #page section -->
</body>
</html>ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER