Form Elements

Introduction

Here are major HTML form elements and how to use them with PHP.

Code - HTML


<form action="php.php" method="post">
	<label>Text - Name</label>
	<input type="text" name="Name" />
	<br />
	<label>Pull-down menu - Gender</label>
	<select name="gender">
		<option value="M">Male</option>
		<option value="F">Female</option>
	</select>
	<br />
	
	<label>Radio button - Age</label>
	<input type="radio" name="age" value="0-20" />0-20
	<input type="radio" name="age" value="21-40" />21-40
	<input type="radio" name="age" value="41-60" />41-60
	<input type="radio" name="age" value="61-" />61-
	<br />
	
	<label>Checkbox - Hobby</label>
	<input type="checkbox" name="hobby[]" value="Reading" />Reading
	<input type="checkbox" name="hobby[]" value="Traveling" />Traveling
	<input type="checkbox" name="hobby[]" value="Fishing" />Fishing
	<input type="checkbox" name="hobby[]" value="Golfing" />Golfing
	<br />
	<input type="submit" value="Submit" />
</form>
	

Code - PHP


<?php
	
	$name = $_POST['Name'];
	$gender = $_POST['gender'];
	$age = $_POST['age'];
	$hobby = $_POST['hobby'];
	echo "Name: $name <br />";
	echo "Gender: $gender <br />";
	echo "Age: $age <br />";

	if (empty($hobby)) {
		echo "Hobby: None <br />";
	} else {
		echo "Hobby: <br />";
		foreach ($hobby as $value) {
			echo "$value <br />";
		}
	}
?>
	

Demo

Open in new window

Task

Create a form with 9 checkboxes for numbers 1 to 9. When the form is submitted, display the sum of the numbers selected.

Reference

PHPFORKIDS.COM
W3SCHOOLS.COM
FORMGET.COM