You should already know how to create HTML forms. Here are some extra techniques which might help.
Grouping form fields
If you create a big form it may get confusing for the user. One way to help is to create groups of fields with common content. For example the customers address fields. This is done with the FIELDSET element. Optionally you can add a LEGEND element to identify the theme of the FIELDSET.
You could use CSS and perhaps JavaScript to only display one FIELDSET of fields at a time. Perhaps using a tabbed effect or a next... layout. This could confuse the user though if they do not understand that all of the fields still belong in one form.
Form data as arrays
If you now know about arrays having looked at the Beginners PHP tutorial this page might be useful. If not then skip it as it is only useful with some server-side scripting.
If you name a form field with square brackets at the end of the name then the results end up in an array:
<form method="post" action="http://www.yourwebskills.com/files/examples/process.php">
<label for="product1">Product ID to order: </label>
<input type="text" name="product[]" id="product1" size="15" value="eggs"/>
<label for="product2">Product ID to order: </label>
<input type="text" name="product[]" id="product2" size="15" value="cabbages"/>
<input type="submit" />
</form>
The advantages of this come when dealing with the values afterwards and it also allows you to add to the form fields dynamically (using JavaScript) without worrying about how many products will be ordered.
Look again at how JavaScript can add HTML elements with appendChild and use that technique attached to a button or link to add more fields to the above form.A big exercise bringing forms, JavaScript, PHP, MySQL and AJAX together




