Get Multiple Values of Selected Checkboxes in PHP 7

Last updated on by Digamber
In this tutorial, our primary goal is to get values of multiple checked or selected checkboxes and implement checkboxes validation in PHP 7.

Checkboxes in PHP 7

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 7 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 Validation in PHP

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 7 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.