During the development of interactive web sites using PHP and HTML it is requiredto deal with data flow between user/browser and the server. This is achieved by using HTML forms and supporting HTML form elements. Following examples shows how these form elements can be used in HTML andPHP to allow interaction between user and the server.
Text input HTML form element
This input form element can be used for a single lime text input from the user. For example user first name, user e-mail, phone numbers etc. The syntax in HTML form is as below
<input type=”text” name=”username”>
<input type=”text” name=”email”>
This will display an input box in the browser and the values of this element canbe accessed at the form handling php script by following.
<?php echo “User Name:”.$_POST[‘username’]; ?>
Password type. The defulat type of HTML input element is text. The special password type of input can be used as following
<input type=”password” name=”password”>
and can be accessed in PHP similar to above input element.
<?php echo “The Password is:”.$_POST[‘password’]; ?>
Hidden type. The hidden field is used to send information from browser to the server without having to input it. Typically this is used to send some logical data that has nothing to do with user but used at the server in PHP program logic. For example state, action, or passing the result to the other module etc. Please note that you encode the value using htmlspecialchars() function.
<input type=”hidden” name=”action” value=”<?php echo htmlspecialchars(‘step2’); ?>”>
and the value of this field can be accessed in PHP by following.
<?php echo “The Value of action is:”.$_POST[‘action’]; ?>
Textarea multiline text HTML form element
This form element can be used for a multi-line text input from the user. For example product description. The syntax is as below.
<textarea name=”description” rows=”5″ cols=”50″></textarea>
This will display a multi-line input area in the browser and the size can be controlled using rows and cols tag. The text value input by user can be accessed in PHP by following
<?php echo “Product Description:”.$_POST[‘description’]; ?>
Select (Pull Down menu) and Select multiple HTML form element
This type of HTML form element is used to allow user to select from multiple choices. For example selecting a month or a day. The html syntax is as below.
<select name=”year”>
<option value=”2004″>2004</option>
<option value=”2005″>2005</option>
<option value=”2006″>2006</option>
<option value=”2007″>2007</option>
<option value=”2008″>2008</option>
</select>
The value of selected choice can be accessed in form handling PHP script as following
<?php echo “Selected Year is:”.$_POST[‘year’]; ?>
The variation to this allows user to select multiple choices from the given options.
This can be done by following select multiple syntax
<select multiple name=”colors[]” size=”4″>
<option value=”Red”>Red
<option value=”Yellow”>Yellow
<option value=”Blue”>Blue
<option value=”Green”>Green
<option value=”White”>White
<option value=”Black”>Black
</select>
The size tag can be used to control how many rows should be visible. And note the use of ‘[]’ following the name of the select box. This will denote that it is an array and the choices can be accessed in form handling PHP script by following.
<?php
foreach ($_POST[‘colors’] as $key => $value) {
echo “Key: $key; Value: $value<br>”;
}
?>
If Red and Green is selected then above code will print
0: Red
1: Green
Radio button HTML form element
Radio button in HTML form is an alternative method that allows user to select from given options. Unlike drop down menu this is used to create more visibilty in the input form.
<input type=”radio” name=”colour” value=”Red”>Red
<input type=”radio” name=”colour” value=”Orange”>Orange
<input type=”radio” name=”colour” value=”Blue”>Blue
The value of the selection can be accessed in PHP as following
<?php echo “Selected Color is:”.$_POST[‘colour’]; ?>
Check Box button HTML form element
This is an alternative way of allowing user to select multiple choices from the given options. Following example show the use of Check Boxes in an HTML form
<input type=”radio” name=”colour[]” value=”Red”>Red
<input type=”radio” name=”colour[]” value=”Orange”>Orange
<input type=”radio” name=”colour[]” value=”Blue”>Blue
<input type=”radio” name=”colour[]” value=”Violet”>Violet
<input type=”radio” name=”colour[]” value=”Black”>Black
Again here PHP array is used to access the selected choices from the user.
<?php
foreach ($_POST[‘colors’] as $key => $value) {
echo “Key: $key; Value: $value<br>”;
}
?>
If Red and Violet is selected then above code will display
0: Red
1: Violet
Posted by V.HPatel