Home|Sitemap|Contact

How can you validate a form with no alert box but still show an error message?


Complete the form.

Field 1: 
Field 2: 



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">

<head>
<title>Form Validate With No Alert</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="author" content="Roderick Divilbiss">
<meta name="copyright" content="© 2005, 2006 Roderick Divilbiss">
<script type="text/javascript">
<!--
function validate(frm) {
  var message='';
  var fvalid=true;

  if (frm.textbox1.value=='') {
    fvalid=false;
    message+='Please enter a value in Field 1<br>';
  }
  if (frm.textbox2.value=='') {
    fvalid=false;
    message+='Please enter a value in Field 2<br>';
  }
  if (fvalid==true) {
    return true;
  } else {
    document.getElementById('errorMessage').innerHTML=message;
    document.getElementById('errorMessage').style.color='#FF0000';
    return false;
  }
}
//-->
</script>
</head>

<body>
<span id="errorMessage">Complete the form.</span>
<form name="frmEntry" method="post" action="formValidateNoAlert.asp" onsubmit="return validate(this);">
  <p>Field&nbsp;1:&nbsp;<input type="text" size="25" name="textbox1"><br>
  Field&nbsp;2:&nbsp;<input type="text" size="25" name="textbox2"><br>
  <input type="submit" value="Submit">
</form>
</body>

</html>