Form Processing with PHP: Part 1

Form Processing

Forms are usually used to gather information from visitors to your website. Once you've gathered the information, it can be used in several ways. It can be sent via email for someone to read, saved to database, or used to find data in the database that matches a specific criteria.

For example:
If you had a guest book that automatically save guests' comments into a database, you would use a form on the guest book page to the comments into the database. To search your database for what a specific guest said, you would can use a search form to pull individual guest comments out of the database.

There are two parts to a form: the form fields that a visitor enters information into and the script that process the information.

The typical sequence:

• Display an empty form to the user
• User fills out the form
• User submits the form for processing when s/he is done filling out the form
  

  ---

• Verify that the data entered into the form is valid and let the user know about an error if it occurs
• Use the gathered data to perform an action

Form construction:

The form tag sets up the form properties.

<form method="post" enctype="multipart/form-data" action="myscript.php">

ENCTYPE: Encryption type for the data. The default MIME-type for form submission is application/x-www-form-urlencoded. This MIME-type will take your text and will remove any spaces and punctuation, replacing them with special character codes. The text/plain MIME-type is often used with mailto form method to send data as plain text. The multipart/form-data MIME type splits the form data into a number of separate parts, one for each form element, and then sends the parts, each encoded in their own different way. This is used when uploading files with a form.

METHOD: How the data gets treated (GET or POST), MAILTO
The GET method - the form data is combined into a string, and this string is added on to the end of a url - for example: http://www.examplesite.com/form.php?first=firstname&last=lastname. GET limits the amount of data that you can collect and submit to a script at one time.

The POST method groups the data together and sends it to the program by HTTP (HyperText Transfer Protocol), you don't see what data is being sent. POST is recommended for PHP because you can send more data

MAILTO: the mailto: method sends form data to a specific email address

ACTION: the location of script that will process the form.>

Form Elements:
Within a form tag, there are form elements. Each form element should have a name and a value.
The name of the form element identifies the information being sent to a script. The value of the form element is the actual data.

Input field Tags: Usually contains a short line of text.

< input type="text" name="a name" value=" a value A" size="#" maxlength="#" checked >

Input Attributes:
TYPE: Determines what kind of input field is shown in the form.

TEXT
PASSWORD
CHECKBOX
RADIO
HIDDEN
NAME: Sets the name of the form element, whose value will be assigned as the value of a variable in the script. If the visitor does not fill out this field, and you did not give it a default value, the value will be sent to the script as undefined.

VALUE: Sets the value of the form element. This can be pre-set to a defalut value or left blank for the user to enter information* OPTIONAL *.

SIZE: Sets the size of the input ( Text and Password ) * OPTIONAL *.

MAXLENGTH: Sets the maximum number of characters typed in the input box ( Text and Password ) * OPTIONAL *.

CHECKED: In Radio or Checkboxes, this pre-selectes an element before the user chooses it.

The different types of input type styles:

Text field: A text field allows numbers and characters to be entered.
<input type="text" name="first" value="first A" size="15" maxlength="15">

Password: Same as a text field, however *'s appear instead of what the user types into the field.
< input type="password" name="second" value="" size="15" maxlength="15" >

Checkboxes: A group of boxes that can be selected. Usually denoted with squares, and a values MUST be declared. ( Multiple boxes may be checked )

< input type="checkbox" name="third" value="pen">Pen
<input type="checkbox" name="third" value="paper" checked>Paper

Pen
Paper

Radio: The same as a checkbox, however if the 'names' are the same you can only select one of the radio buttons. (Again a value MUST be declared)

< input type="radio" name="fourth" value="pencil" > Pencil
< input type="radio" name="fourth" value="crayon" checked > Crayon

Pencil
Crayon

Hidden: The hidden input filed, works exactly like the text field, however the user can't enter anything into this box and it is not visible in a form, if you look at the source code of a page you will be able to tell if a form has a hidden input field. It's best used to pass values that you don't want the user to change. (A value MUST be declared)

< input type="hidden" name="fifth" value="Invisible Ink"> You can't see me Invisible Ink

Select List boxes:
Select: The select list box lets you choose from a list of predefined choices
< select name="sixth" >
< option value="blue" > Blue ink
< option value="black" selected > Black ink
< option value="reds" > Red ink
< /select >

SELECTED pre-selects a choice.

SIZE Sets the size of the select list box * OPTIONAL *.

Multiple Select: The multiple-select box lets you choose more than one choice from a list of predefined choices
Hold down the 'Ctrl' key while clicking the mouse to select more than one choice.

Textarea: Allows a user to type a large amount of text into a text field. The 'wrap' attribute determines how text in the textarea will behave.

Wrap attribute:

Physical: Press the 'enter' key for a new line

Virtual: New line is created when the sentece typed reaches the end of the column width

Hard: New line created by pressing the 'enter' key or when the end of the column width is reached.

Size attributes:
Cols: Sets how many columns the textarea will be

Rows: Sets how many rows the textare will be

<textarea name="seventh" wrap="hard" cols="10" rows="3"> </textarea>

Reset / Submit: Creates the buttons for submitting and reseting the form.

<input type="Submit" value="Submit!">

<input type="Reset" value="Reset!">

Forms can be implemented using either a single or multiple page design. The single page technique utilizes a self-referring script to display and process the form. Multi-page forms take the user through a series of pages to enter, confirm and submit the data.

The other important area to consider when thinking about form design is the reporting mechanism for invalid data. Some people like to display the form with the input highlighting any errors. This makes it simple for the user to find and fix problems in the data. Others prefer to keep the page and application design as simple as possible by reporting errors on a separate page. The user then needs to either go back to the original form using the back button on their browser or they may be presented with a link to a page which will contain their entered data.

Putting it together:

When a form is submitted, all HTML variables are passed to a PHP script and assigned their respective variable names. In our example, the input text field is named "UserName" so when the form is submitted $UserName will hold the value. The variable $submit, that corresponds to the input name="submit", will hold the value "click". It is only set if we click the submit button and not when we directly access input.php with our browser.

PHP code for 'input.php'. It creates a form to allow users to enter their name.

PHP Code:

Remember to escape quotation marks, by putting a slash before them, if you're using 'echo' or 'print' to output HTML.

This section shows what will be seen, when the file is viewed in a HTML browser.

Web Browser Result:

Retrieving The Input When Submit is Clicked

Now we will add a simple condition to the beginning of our previous example. If the user clicked the submit button then print out the name that was entered in the text field; otherwise, we display the HTML form again.

Because the action in the form points to input.php our script will be called again when the user clicks submit.

PHP Code:

See it in action. ¦ Get complete code.