How to Get Multiple Values of Selected Checkboxes in PHP

Sometimes we need to submit the checkbox with multiple values in form and Get Multiple selected checkboxes value. In this tutorial we are going to discuss how we can get multiple values of selected checkboxes in PHP.

We know that checkbox is used for multiple selection in form. Many time we can see when we have to take the multiple selection from the user for example there is a form in which user has to selection his hobbies from given option. Possibly he will choose more than one hobby and that hobby we need to submit through form and get stored in the database.

In making this tutorial we will create a small fruit list with multiple checkboxes to show the user multiple fruit name. Now user can select multiple fruit in the form and can submit the same.

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

We use isset($_POST[‘submit’]) method checks whether the submit value is declared in the form is actually declared or not. Using the isset function we also get to know that if the submitted values are set.

<?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. Sometimes we need to validate whether checkboxes are selected or not. Below is the code you can validate the same.

We can validate the code in two way. One is client side and other is server side. In client side validation we can restrict the user to selected particular or any one fruit from the list.

In server side validation, when we submit the form it gets checked in server side. Below is the server side validation example.

<?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>';
      }
  }
?>

Modify Checkboxes with css

We can also modify the checkboxes with the help of CSS. Default you we get the old layout of checkbox, and with help of some CSS you can modify it so very nice view.

<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. Below is the CSS code to modify the chekboxes.

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 Code Example

Below is the final code of server side validation of checkboxes. If no checkbox selected then it will give Checkbox is not selected! message after form submission.

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

Output

Conclusion

In this tutorial we learned how to work with checkboxes. We have seen how to get multiple values and implement validation in PHP.

check Array to XML Conversion and XML to Array Convert in PHP