HTML and CSS Reference
In-Depth Information
Adding the checkboxes and text area
You know the drill: look over the new HTML and add it to your “form.html”.
<form action="" method="post">
Choose your beans:
<select name="beans">
<option value="House Blend"> House Blend </option>
<option value="Bolivia"> Shade Grown Bolivia Supremo </option>
<option value="Guatemala"> Organic Guatemala </option>
<option value="Kenya"> Kenya </option>
Type: <br>
<input type="radio" name="beantype" value="whole"> Whole bean <br>
<input type="radio" name="beantype" value="ground" checked> Ground
<p> Number of bags: <input type="number" name="bags" min="1" max="10"></p>
<p> Must arrive by date: <input type="date" name="date"></p>
Here we've added a che ckbox for each option. Notice
that these share the sa me name, “extras[]”…
Extras: <br>
<input type="checkbox" name="extras[]" value="giftwrap"> Gift wrap <br>
<input type="checkbox" name="extras[]" value="catalog" checked> Include catalog
with order
As with the
radio b uttons,
we've p ut
these la bels to
the rig ht of
the che ckboxes .
We're using the
checked attribute
to specify that
the catalog option
should be checked
by default. You
can add a checked
attribute to more
than one checkbox .
Ship to: <br>
Name: <input type="text" name="name" value=""><br>
Address: <input type="text" name="address" value=""><br>
City: <input type="text" name="city" value=""><br>
State: <input type="text" name="state" value=""><br>
Zip: <input type="text" name="zip" value=""><br>
Phone: <input type="tel" name="phone" value=""><br>
<p> Customer Comments: <br>
<textarea name="comments"></textarea>
<input type="submit" value="Order Now">
Search WWH ::

Custom Search