Get Multiple Values of Selected Checkboxes in PHP 8
A checkbox is also known as a tick box or a selection box. A checkbox is a tiny user interface component that allows users to select more than one option from a given options list.
We will create a small fruits list using HTML 5 and display that checkboxes list to the users to select more than one option.
We will get the multiple values of selected checkboxes with PHP 8 and learn to implement the multiple checkbox validation in PHP.
If you are getting started in PHP, then do check out our detailed articles on Building CRUD REST API in PHP and MySQL and Getting Multiple Select Option Values in PHP
Create Form with Multiple Checkboxes
Create a form using HTML form element, define input field with the type="checkbox"
value.
The checkArr[]
is an array object which is defined in the name-value, which is used to communicate with the PHP.
<form action="" method="post">
<label>
Apple
<input type="checkbox" name="checkArr[]" value="Apple">
</label>
<label>
Banana
<input type="checkbox" name="checkArr[]" value="Banana">
</label>
<label>
Coconut
<input type="checkbox" name="checkArr[]" value="Coconut">
</label>
<label>
Blueberry
<input type="checkbox" name="checkArr[]" value="Blueberry">
</label>
<input type="submit" name="submit" value="Choose options" />
</form>
Read Multiple Values from Selected Checkboxes
The isset($_POST[‘submit’]) method checks whether the submit value is declared or not.
In the isset function, we are employing another validation and making sure whether the checkboxes’ values are set or not using the empty()
function.
Use the foreach()
loop to iterate over every selected value of checkboxes and print on the user screen.
<?php
if(isset($_POST['submit'])){
if(!empty($_POST['checkArr'])){
foreach($_POST['checkArr'] as $checked){
echo $checked."</br>";
}
}
}
?>
Checkboxes Validation in PHP
To add the validation in checkboxes, place the following code in your PHP template.
<?php
if(isset($_POST['submit'])){
if(!empty($_POST['checkArr'])){
foreach($_POST['checkArr'] as $checked){
echo $checked . '<br>';
}
} else {
echo '<div class="error">Checkbox is not selected!</div>';
}
}
?>
Checkboxes with Custom Style
Add the span tag below the input field to add the custom styling in checkboxes.
<form action="" method="post">
<label>
Apple
<input type="checkbox" name="checkArr[]" value="Apple">
<span></span>
</label>
<label>
Banana
<input type="checkbox" name="checkArr[]" value="Banana">
<span></span>
</label>
<label>
Coconut
<input type="checkbox" name="checkArr[]" value="Coconut">
<span></span>
</label>
<label>
Blueberry
<input type="checkbox" name="checkArr[]" value="Blueberry">
<span></span>
</label>
<input type="submit" name="submit" value="Choose options" />
</form>
Style checkbox with only HTML and CSS.
label {
display: block;
position: relative;
padding-left: 35px;
margin-bottom: 20px;
cursor: pointer;
font-size: 22px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
line-height: 25px;
}
/* Hide the browser's default checkbox */
label input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
/* Create a custom checkbox */
span {
position: absolute;
top: 0;
left: 0;
height: 25px;
width: 25px;
background-color: #cccccc;
}
label:hover input~span {
background-color: #cccccc;
}
label input:checked~span {
background-color: #1A33FF;
}
span:after {
content: "";
position: absolute;
display: none;
}
label input:checked~span:after {
display: block;
}
label span:after {
left: 9px;
top: 5px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
Final PHP 8 Checkboxes Code Example
Here is the complete code example for checkboxes in PHP.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>PHP - Get Multiple Checkbox Value DEMO</title>
</head>
<body>
<div class="container mt-5">
<form action="" method="post" class="mb-3">
<label>
Apple
<input type="checkbox" name="checkArr[]" value="Apple">
<span></span>
</label>
<label>
Banana
<input type="checkbox" name="checkArr[]" value="Banana">
<span></span>
</label>
<label>
Coconut
<input type="checkbox" name="checkArr[]" value="Coconut">
<span></span>
</label>
<label>
Blueberry
<input type="checkbox" name="checkArr[]" value="Blueberry">
<span></span>
</label>
<input type="submit" name="submit" value="Choose options" />
</form>
<?php
if(isset($_POST['submit'])){
if(!empty($_POST['checkArr'])){
foreach($_POST['checkArr'] as $checked){
echo $checked . '<br>';
}
} else {
echo '<div class="error">Checkbox is not selected!</div>';
}
}
?>
</div>
</body>
</html>
Conclusion
In this tutorial we learned how to work with checkboxes. We have seen how to get multiple values and implement validation in PHP.