JavaScript EditorBest javascript editor debugger     Ajax website 

Main Page

Previous Page
Next Page

Creating a Form

A form has three important parts: the form tag, which includes the URL of the script that will process the form; the form elements, like fields and menus; and the submit button which sends the data to the script on the server.

Figure 17.1. Every form has three parts: the form tag, the actual form elements where the visitor enters information, and the submit button (or active image) that sends the collected information to the server.

To create a form:

Type <form method="post".

Type action="script.url"> where script.url is the location on the server of the script that will run when the form is submitted (see page 256).

Create the form's contents, as described on pages 262280, including a submit button (see page 272) or active image (see page 276).

Type </form> to complete the form.

Figure 17.2. Here is a portion of the style sheet used to format the form. You can find the full style sheet on the Web site (see page 26).


  • You can download the showform.php script from my Web site (see page 26) and use it in step 2 to test your forms as you go through this chapter. It is also shown in Figure 17.4 on page 256.

    Figure 17.4. Here is the script used to process the forms in this chapter. Notice how the PHP script lives right in an (X)HTML page. (You can find a commented version of this script on my Web site.)

  • In order for your visitor to send you the data on the form, you'll need either a submit button or an active image. For more on submit buttons, consult Creating the Submit Button on page 272. For details on active images, consult Using an Image to Submit Data on page 276.

  • You can use CSS (see page 169) or tables (see page 227) to lay out your form elements. The example that I demonstrate with illustrations throughout this chapter and in Figure 17.3 was created using strict XHTML and CSS.

    Figure 17.3. Here is the complete form discussed in this chapter.

  • You can also use the get method to process information gathered with a form. However, since the get method limits the amount of data that you can collect at one time, I recommend using post.

Previous Page
Next Page

JavaScript EditorBest javascript editor debugger     Ajax website