The following code forces the user to first fill in the given name
text box and then the
family name text box. It does not and should not depend on any submit event.
It will not
let the user do anything else unless those two fields are completed. The
combination of
the necessary onBlur() with the focus() event makes it complicated, but it
works with
the help of var GivenNameComplete.

With the onLoad="TheForm.GivenName.focus()" event still in place would anybody
how to modify this code so the user can choose what field to begin with?


<title>Didactics Questions For Trainers</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
var GivenNameComplete=false;

function ValiGivenName(){
if (TheForm.GivenName.value=='') {
alert('Please fill in your given name.');

function ValiFamilyName(){
if (TheForm.FamilyName.value=='' && GivenNameComplete) {
alert('Please fill in your family name.');

<body bgcolor="E4E4E4" onLoad="TheForm.GivenName.focus()">

<form name="TheForm" method="post" action="Validation.html">
<p>Given name: <input type="text" name="GivenName" onBlur="ValiGivenName()">
Family name: <input
type="text" name="FamilyName" onBlur="ValiFamilyName()"> </p>