Mailto Form JavaScript Tutorial

An easy to install comments form for use on sites that do not have CGI-bin access.

This script verifies an entry into the name and email field. It can be customized to verify any or all entries.

The complete script is shown below; copy and paste the code into your page as instructed.

Step 1: Paste Into the Head

Paste this, unchanged, into the head of your document. This is the same as the head.txt document in the zip file.

<!--Diana Petersen at webdesigns-4-you.com gave me this script.-->
<script language="JavaScript">
<!--
function validate_form() {
  validity = true; // assume valid
  if (!check_empty(document.form.NAME.value))
  	{ validity = false; alert('Name field is empty!'); }
  if (!check_email(document.form.EMAIL.value))
  	{ validity = false; alert('Email address is invalid!'); }
  if (validity)
  	alert ("Needed entries have been verified. "
  		+ "Your form is now being passed to your browser's "
  		+ "Mail Delivery Sub-System.");
  return validity;
}
function check_empty(text) {
  return (text.length > 0); // returns false if empty
}
function check_email(address) {
  if ((address == "")
    || (address.indexOf ('@') == -1)
    || (address.indexOf ('.') == -1))
      return false;
  return true;
}
// -->
</script>

Verify Fields

You do not need to change anything in the above code. As mentioned above, it is set to verify the name and email fields; you will need to customize this part to verify more fields.

Copy and paste this line of code into the script. This is a copy of the name validation; change the NAME and Name to the field you want to verify. Paste these lines of code in order as they appear in the form.

Build Your Form

This is a working example. We have included a little bit of everything to help you create your own form fields.

Here is the form; you can copy and paste it into your page then customize it to fit your needs. We have added a little bit of everything to help you create the form fields you need. The only difference between this form and the one in the zip file is the addition of the radio buttons.

Paste the form into your page where you want the form to be.

<form name="form" method="post" action="mailto:dixiedi@webdesigns-4-you.com?SUBJECT=JavaScript Form" enctype="text/plain" onsubmit="return validate_form()">
<b>
Name:<br><input type="text" size="50" name="NAME"><br><br>
Email:<br><input type="text" size="50" name="EMAIL"><br><br><br>
<b>Do you like JavaScript?</b> <input type="radio" name="like javascript" value="yes" checked>yes <input type="radio" name="like javascript" value="no">no
<br>
<br>
What Products/Services are you interested in?<br></b>
<input type="CHECKBOX" name="DESIGN" value="yes">Web Page Design<br>
<input type="CHECKBOX" name="JAVASCRIPT" value="yes">JavaScript Contracting<br>
<input type="CHECKBOX" name="NETWORK" value="yes">Network Development<br>
<input type="CHECKBOX" name="CONSULTING" value="yes">Internet Consulting<br>
<br>
<b>How Did You Get to Our Site?</b>
<br>
<select name="HowGotHere" size="1">
<option>Search Engine
<option>A friend suggested it
<option selected>Link from another web site
  <option>Other</option>
</select>
<br><br>
if other, be more specific:<br>
<input type="TEXT" name="MORE_SPECIFIC" value="We really want to know" size="50"><br><br>
Comments:<br>
<textarea name="COMMENTS" rows="8" cols="50" wrap="virtual">Type in here.

What Else You Must Change

You must change the email address. It is the third line of the form. It is currently configured to send email to me. Be sure to change it or your visitors will be sending email to me.

Problems configuring the script or your form? Just fill out the form above to let us know. Please be as specific as possible about the problem you are having.