Web Perschon

HTML Check Button

Check button is an INPUT, also known as checkbox. It privides multiple choices for user to select.

To define a checkbox, set the type attribute of INPUT to "checkbox".
<input type="checkbox" value="Test Check Box">Test Check Box

Test Check Box

The value attribute of the checkbox will be used by the handling program. The text next to the checkbox will be shown on the webpage.

To let the checkbox shown as checked, add "checked" to the INPUT:
<input type="checkbox" value="Test Check Box" checked>Test Check Box

Test Check Box

Following code shows checkbox handling using PHP:

Image

Tags

Font

Basic Page



The main HTML code:

<FORM name=tt2 action="<?PHP $_SERVER['PHP_SELF']?>" method="post">
<input type="checkbox" name="cb[]" value="image" <?PHP if ($image == 1) 
 echo "checked"; ?> >Image<p>
<input type="checkbox" name="cb[]" value="tags" <?PHP if ($tags == 1) 
 echo "checked"; ?> >Tags<p>
<input type="checkbox" name="cb[]" value="font" <?PHP if ($font == 1) 
 echo "checked"; ?> >Font<p>
<input type="checkbox" name="cb[]" value="basicpage" <?PHP 
if ($basicpage == 1) echo "checked"; ?> >Basic Page<p>
<input type=submit style="width:80px;height:28px" name="submit2">
<input type=submit value="Clear" style="width:60px;height:28px">
<?PHP
if ($flagcheckbox == 1 && isset($_POST['submit2'])) 
 echo "<br><br><font color=\"red\">Your selected $checkbox.</font>\n";
?>


The PHP code for handling the checkbox is:
<?PHP
$checkbox = "";
$flagcheckbox = 0;
$arr=array();
$image=0;
$tags=0;
$basicpage=0;
$font=0;

if (isset($_POST['submit2']) && isset($_POST['cb']))
{
	$arr = $_POST['cb'];
	if (count($arr) > 0) $flagcheckbox = 1;
	for ($ii=0;$ii < count($arr);$ii++)
	{
		$checkbox .= $arr[$ii] . " ";
		if ($arr[$ii] == "image") $image = 1;
		if ($arr[$ii] == "tags") $tags = 1;
		if ($arr[$ii] == "font") $font = 1;
		if ($arr[$ii] == "basicpage") $basicpage = 1;
	}
}
?>

The above PHP code is included in the beginning of this webpage. If you select the check boxes, and click "submit" button, the value of selected checkbox will be shown below the "submit" button.