Question

Im in the process of creating a simple HTML contact form and I would like to validate three fields; Name, Email and Message. However Im not the smartest when it comes to javascript field validation and would like some assistance. My current form is below:

<form action="cgi-bin/FormMail.pl" method="post">
<input type="hidden" name="subject" value="From the feedback form" />
<input type="hidden" name="redirect" value="thankyou.html" />
<p>Whatever you want to say here</p>
<p>&nbsp;</p>
<table>
<tr>
<td align="left">Name:</td>
<td><input type="text" name="name" size="30" value="" /></td>
</tr>
<tr>
<td align="left">E-Mail:</td>
<td><input type="text" name="email" size="30" value="" /></td>
</tr>
<tr>
<td align="left">Content:</td>
<td><textarea name="comment" cols="50" rows="5"></textarea></td>
</tr>
<tr>
<td><input type="submit" value="Submit" /></td>
<td></td>
</tr>
</table>
<input type="hidden" name="redirect" value="thankyou.html" />
</form>

Answer 1

For your Reference : Modify as per your need

<script type="text/javascript">
function validateform()
{
var x=document.forms["myForm"]["name"].value;
if (x==null || x=="")
  {
  alert("Name Is Blank");
  return false;
  }

var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
  {
  alert("invalid e-mail address");
  return false;
  }

var x=document.forms["myForm"]["comment"].value;
if (x==null || x=="")
  {
  alert("Comment is blank");
  return false;
  }
}
</script>


<form name="myForm" action="cgi-bin/FormMail.pl" method="post" onsubmit="return validateform()">
<input type="hidden" name="subject" value="From the feedback form" />
<input type="hidden" name="redirect" value="thankyou.html" />
<p>Whatever you want to say here</p>
<p>&nbsp;</p>
<table>
<tr>
<td align="left">Name:</td>
<td><input type="text" name="name" size="30" value="" /></td>
</tr>
<tr>
<td align="left">E-Mail:</td>
<td><input type="text" name="email" size="30" value="" /></td>
</tr>
<tr>
<td align="left">Content:</td>
<td><textarea name="comment" cols="50" rows="5"></textarea></td>
</tr>
<tr>
<td><input type="submit" value="Submit" /></td>
<td></td>
</tr>
</table>
<input type="hidden" name="redirect" value="thankyou.html" />
</form>