<html>
<head>
<title>Abakada Forms Tutorials: Basic HTML Form Controls</title>
<link rel="stylesheet" href="/shared/netdemos.css">
<script src="/shared/shared.js"></script>
<style type="text/css">
<!--
h4 { text-decoration: underline;
color: steelblue; margin-top: 10; margin-bottom: -10 }
h5 { margin-bottom: 10}
-->
</style>
</head>
<body>
<!-- #include virtual="~/shared/top.inc" -->
<div class="header"><h2>Abakada Forms Demo: Basic <span class="hilite">HTML Form Controls</span></h2></div>
<!-- #include virtual="~/shared/viewsrc_top.inc" -->
<hr size=1 width=92%>
<center>
<form>
<table width=90% cellpadding=5 style="margin-left:100">
<tbody>
<tr>
<td>
<h4>One-line text box</h4>
<h5>We use a one-line text box for a small amount of text input.</h5>
<b>Please enter your e-mail address</b>:<br>
<input value="someone@where.com" size="25">
<p></p></td></tr>
<tr>
<td>
<h4>Push button</h4>
<h5>We use push buttons to let users do some action, like run a default or custom script.</h5>
<input type="button" value="Submit"> <input type="reset" value="Reset">
<p></p></td></tr>
<tr>
<td>
<h4>Radio buttons</h4>
<h5>We use radio buttons when we want users to choose only one option.</h5>
<input type="radio" name="opt"><b>A</b>
<input type="radio" checked name="opt"><b>B</b>
<input type="radio" name="opt"><b>C</b>
<p></p></td></tr>
<tr>
<td>
<h4>Check box</h4>
<h5>We use check boxes for optional items. Allows one or multiple selections.</h5>
<table>
<tr>
<td><input id="cb0" type="checkbox"></td>
<td><label for="cb0"><b>Yes, I would like to receive updates</b></label></td></tr>
<tr>
<td><input id="cb1" type="checkbox"></td>
<td><label for="cb1"><b>Yes, I would like to receive money too</b></label></td></tr>
</table>
<p></p></td></tr>
<tr>
<td>
<h4>Scrolling text box</h4>
<h5>We use a scrolling text box for one or more lines of text.</h5>
<b>Please add your comments here:</b><br>
<textarea cols="100" rows="4" name="scroll">This field automatically provides scrollbars to accommodate varying amounts of text. This control is useful when we need to save form space. This is by the way the control that is used on most email programs and in bulletin boards and discussion forums. There is practically no limit to how much content we can place in the scrollable textbox. But also bear in mind not to give your users a hard time by letting them scroll all the way down or to the right, only to find out that there really is nothing else here but just this example nonsense.</textarea>
<p></p></td></tr>
<tr>
<td>
<h4>Drop-down menu</h4>
<h5>We use a drop-down menu for a list of choices. Takes less space, and also allows one or multiple selections.</h5>
<b>Where do you want to go today?</b><br>
<select>
<option selected>Here</option>
<option>There</option>
<option>Everywhere</option>
</select>
<p></p></td></tr>
</tbody>
</table>
</form>
</center>
<hr size=1 width=92%>
<!-- #include virtual="~/shared/viewsrc.inc" -->
</body>
</html>