Java Reference
In-Depth Information
You can use the
readonly
attribute of the
<input/>
element, or the corresponding
readOnly
property, to prevent the contents from being changed:
<input type="text" name="txtReadonly" value="Look but don't change"
readonly="readonly">
The
keypress
,
keydown
, and
keyup
events fire, as their names suggest, when the user presses a key,
when the user presses a key down, and when a key that is pressed down is let back up, respectively.
a Simple Form with Validation
trY it out
Let's put all the information on text boxes and buttons together into an example. In this example, you
have a simple form consisting of two text boxes and a button. The top text box is for the users' name,
and the second is for their age. You do various validity checks. You check the validity of the age text
box when it loses focus. However, the name and age text boxes are only checked to see if they are empty
when the button is clicked. This example does not work properly on Firefox; we'll discuss this shortly.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Chapter 11: Example 4</title>
</head>
<body>
<form action="" name="form1">
Please enter the following details:
<p>
Name:
<input type="text" name="txtName" />
</p>
<p>
Age:
<input type="text" name="txtAge" size="3" maxlength="3" />
</p>
<p>
<input type="button" value="Check details" name="btnCheckForm">
</p>
</form>
<script>
var myForm = document.form1;
function btnCheckFormClick(e) {
var txtName = myForm.txtName;
var txtAge = myForm.txtAge;
if (txtAge.value == "" || txtName.value == "") {
alert("Please complete all of the form");
if (txtName.value == "") {
txtName.focus();
} else {
txtAge.focus();
