HTML and CSS Reference
In-Depth Information
Adding the form element
Once you know the URL of the server script that will process your form, all you need
to do is plug it into the action attribute of your <form> element, like this (follow
along and type the changes into your HTML):
<!DOCTYPE html>
<meta charset="utf-8">
<title> The Starbuzz Bean Machine </title>
<h1> The Starbuzz Bean Machine </h1>
<h2> Fill out the form below and click “order now” to order </h2>
<form action="" method="POST">
T he action at tribute con tains the
U RL of the server scrip t.
And reme mber we're using
the POST met hod t o deli ver
the form data to th e ser ver.
Mo re on this l ater.
So far, so good, but an empty <form> element isn't going to get you very far. Looking back
at the sketch of the form, there's a lot there to add, but we're going to start simple and get
the “Ship to” part of the form done first, which consists of a bunch of text inputs and a
number input. You already know a little about text inputs, but let's take a closer look. Here's
what the text inputs for the Starbuzz form look like:
We've go t one text
input fo r each input
area in t he form:
Name, A ddress, City,
State, Z ip, and Phone .
<input type="text" name="name">
<input type="text" name="address">
<input type="text" name="city">
<input type="text" name="state">
<input type="text" name="zip">
<input type="tel" name="phone">
The name attribute acts as an identifier for the
data the user types in. Notice how each one is set to
a different value. Let's see how this works…
Search WWH ::

Custom Search