Month 3 Week 3

Simple Forms

Creating A Simple Form - Client Side

First, there are two kinds of forms - client side and server side. Or, in plain English, one type is run on the visitor's computer, the other is run on the website's computer. Since all but one area is exactly the same, we'll cover form basics here and just the specifics to server side forms on the next page.

Start a new HTML document and call it "test6.htm". Get the page started - 

<HEAD>
<TITLE>My First Form</TITLE>
</HEAD>
<BODY>

Now, let the browser know that you are starting a form -

<FORM METHOD=POST>

There is more than one "method" but for now, just remember to use "post". Since this is a client side form, you are going to use the mailto attribute to tell the browser what to do with the form once someone clicks on the submit button. So modify your <FORM> tag -

<FORM METHOD=POST ACTION="mailto:youremail@isp.com">

Replace the youremail@isp.com with your email address. 

Next, you need to add some places to enter information. Let's just do a quick, what is your name form. Add the following to your page -

<P>Your name:
<INPUT TYPE=text NAME="name" SIZE="50">

Take a look at what you added and see if you can figure out what type, name and size control. 

Finally, you need a button for someone to submit the form, so add in -

<INPUT TYPE=SUBMIT>

Then, just close out the open tags -

</FORM>
</BODY>
</HTML>

After saving it, open your page in your browser and take a look. Try your form! Depending on your computer, you may get a security warning or a failure. If so, upload your page to your free host and try again. 

The most common warning you'll see will be about the page you are viewing trying to send an email and/or file. It is alright to click "OK" or "Allow" because you wrote the form and you didn't add in any viral agents, did you?

There are a number of different <INPUT> types, all of which are listed on the tag page for you to look over later. 

Before you get to that, though, let's discuss server side forms a bit.

©2003, Gnosis 4-H Club
The 4-H name and 4-H logo are service marks protected under 18 U.S.C. 707.

Questions? Comments? Problems? Contact the Webmaster!


Home