How to send multiple checkbox values to php

Live Demo

I have put together an example, a live demo, in which we have three checkboxes.
If you check one or more checkboxes and press the submit button, the form will send the checked values to a php file, and the php file will send the values back as a response.
Try it out.

Let's see how we do this by starting with the files we need.

Files we need

• We need an index.php file, in which we are going to write our html form.
• And a script.php file, to write the php code to fetch the checkbox values.
• Both files live in the same folder.

The HTML form and the checkboxes

In the index.php file we have the html form. Notice that in line 1 we require the script.php file. This means that we are going to have access to the php code every time we press the submit button.

<?php require "script.php" ?>

<form action="" method="post">
	<label>Select your programming skills</label>
	
	<span>HTML</span>
	<input type="checkbox" name="skills[]" value="html">

	<span>CSS</span>
	<input type="checkbox" name="skills[]" value="css">

	<span>JavaScript</span>
	<input type="checkbox" name="skills[]" value="javascript">
	
	<button type="submit" name="submit">Submit</button>
</form>

Analyzing the form

• The action form attribute is left empty, this means that the form will submit the data to the same page. Actually the browser will do a reload on the index.php file.
• The http method attribute is set to POST.
  This means that we have to catch the superglobal $_POST variable in the php file.
• Inside the form and in lines 7, 10, and 13, we have the checkbox elements.
  The important thing here is that the name attribute is an array named "skills[]", and it's the same for all three checkbox elements.
  Because we deal with multiple values, we need an array to store them. We will see this a few lines down when we get to the php code.
  So the name is the same for all checkbox elements, but the values are not. Every checkbox element has a different value.
• And in line 15 we have the form's submit button. The name attribute is set to "submit". This means that, in the php file we have to check if there is a key of "submit" inside the superglobal $_POST variable.
• That is all that we have in the index file, now let's go to the php file to catch the values.

The script.php file

In the php file the first thing that we do is to check if there is post request.

We are checking if the $_POST variable which is an array, contains a key named "submit".
In plain English we are checking if someone pressed the submit button.

<?php
	if(isset($_POST['submit'])){
		var_dump($_POST);
	}

In line 3 we are going to do a var_dump on the $_POST variable to see what the html form is sending.

If we check all checkboxes we will get something like this.

array (
'skills' => array (
    0 => 'html',
    1 => 'css',
    2 => 'javascript',
),
'submit' => '',
)

We see the the superglobal $_POST variable is an array, and inside we have a key named "skills" which is also an array that holds the checked values.

Now it is very easy to grab the "skills" array.

$skills = $_POST['skills'];

Now the $skills variable is holding an array with the checked values.

Let's do a var_dump on the $skills variable to check it out.

var_dump($skills)

And here is our array with the submitted form values.
Assuming that we clicked on all three checkbox elements.

array (
    0 => 'html',
    1 => 'css',
    2 => 'javascript',
)

Now we can do whatever we want with the $skills array.

Summary

In this tutorial we saw how to send multiple checkbox values to the server.

Last Words

Thanks for reading, i hope you find the article helpful.
Please leave a comment if you find any error's, so i can update the page with the correct code.

Source code

You can download the source code and use it in any way you like.

Times downloaded: 277

Buy me a coffee