Skip to content

Commit

Permalink
deleted index.html in js directory.
Browse files Browse the repository at this point in the history
Change-Id: Ibd7c842c6598546895d73e37523f2641021b7736
  • Loading branch information
zoltan-dulac committed May 12, 2011
1 parent db1ae81 commit 022af58
Show file tree
Hide file tree
Showing 2 changed files with 136 additions and 0 deletions.
65 changes: 65 additions & 0 deletions tests/html5Widgets/outputWithBothOnforminputAndOninput.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>Example of the output tag.</title>

<!-- This CSS file is not necessary to use html5Widgets -->
<link type="text/css" rel="stylesheet" href="../../shared/css/useragentmanExample.css">
<link type="text/css" rel="stylesheet" href="css/form.css" />



<!-- What powers html5Widgets -->
<script type="text/javascript" src="../../shared/js/modernizr.com/modernizr-1.5.min.js">
</script>
<script type="text/javascript" src="../../shared/js/html5.js">
</script>
<script type="text/javascript" src="../../shared/js/Timer.js">
</script>
<script type="text/javascript" src="../../shared/js/EventHelpers.js">
</script>

<script type="text/javascript" src="../../shared/js/html5Widgets.js">
</script>

</head>
<body id="myExample" class="html5Widgets-debug">
<div id="exampleBlurb">
<p>The following is an example of using the HTML5 <code>output</code> tag with both
an <code>onforminput</code> event added to it as well as a <code>oninput</code> tag added
to it's form. <a href="#">Back to the User Agent Man HTML5 Forms article</a>.</p>
</div>

<form method="get" action="result.html"
oninput="document.getElementById('output').innerHTML = 'oninput fired at ' + new Date().getTime();">

<fieldset>
<legend>Onforminput and Oninput test</legend>

<p>Enter in a value below. The output field will tell you which
event(s) were fired as a result. It is best not to have both <code>onforminput</code>
and <code>oninput</code> events on the same page (the former is deprecated anyways).</p>
<table class="formTable">
<tbody>
<tr>
<th>Value:</th>
<td><input type="number" name="price" value="" autofocus="autofocus" />

</td>
</tr>

<tr>
<th>Output:</th>
<td><output id="output" onforminput="this.value = 'onforminput fired at ' + new Date().getTime();" ></output>

</td>
</tr>


</tbody>
</table>
</fieldset>
</body>
</html>
71 changes: 71 additions & 0 deletions tests/html5Widgets/outputWithOnInput.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">


<title>Example of the output tag.</title>

<!-- This CSS file is not necessary to use html5Widgets -->
<link type="text/css" rel="stylesheet" href="../../shared/css/useragentmanExample.css">
<link type="text/css" rel="stylesheet" href="css/form.css" />



<!-- What powers html5Widgets -->
<script type="text/javascript" src="../../shared/js/modernizr.com/modernizr-1.5.min.js">
</script>
<script type="text/javascript" src="../../shared/js/html5.js">
</script>
<script type="text/javascript" src="../../shared/js/Timer.js">
</script>
<script type="text/javascript" src="../../shared/js/EventHelpers.js">
</script>

<script type="text/javascript" src="../../shared/js/html5Widgets.js">
</script>

</head>
<body id="myExample" class="html5Widgets-debug">
<div id="exampleBlurb">
<p>The following is an example of using the HTML5 <code>output</code> tag with a form's <code>oninput</code> event to do
some calculations on the data within the form. <a href="#">Back to the User Agent Man HTML5 Forms article</a>.</p>
</div>

<form method="get" action="result.html"
oninput="document.getElementById('taxes').innerHTML = Math.round(price.value * 0.15 * 100) / 100;
document.getElementById('total').innerHTML = Math.round(price.value * 1.15 * 100) / 100">

<fieldset>
<legend>Money You Owe</legend>

<p>Enter in the price and we will calculate what you owe us.</p>
<table class="formTable">
<tbody>
<tr>
<th>Price:</th>
<td><input type="number" name="price" value="" autofocus="autofocus" />
<div class="description">The total of the stuff you just bought. When you fill
this in, you will see the items below will change.</div>
</td>
</tr>

<tr>
<th>Taxes:</th>
<td><output id="taxes">0</output>
<div class="description">This is how much you have to give to The Man, whether you like it or not.</div>
</td>
</tr>

<tr>
<th>Total:</th>
<td><output id="total">0</output>
<div class="description">This is how much you have to shell out in total. Have a nice day!</div>

</td>
</tr>
</tbody>
</table>
</fieldset>
</body>
</html>

0 comments on commit 022af58

Please sign in to comment.