PHP form with multiple checkboxes/Bootstrap buttons

Question

I'm trying to make a contact form where users are supposed to toggle different checkboxes (within checkbox groups), which i've made to buttons with a combination of Bootstrap Button Groups (http://getbootstrap.com/components/#btn-groups) and Bootstrap Toggle (http://www.bootstraptoggle.com), enter their email address and submit. The results of the user input should be sent to a specified recipient email, with following body

Email address
Values of checked checkboxes/toggled buttons

Selection of at least one checkbox within each group is required, and users should be able to check all checkboxes if the choose to.

I'm fairly comfortable with HTML/Bootstrap, but not at all with PHP - I can barely decipher PHP codes and I've stared at 100+ questions and tutorials about PHP forms, only to get more confused, which is why i have no PHP code to show (email.php i just a empty doc waiting to be filled the correct PHP code).

I have no idea where to begin, and absolutely zero idea of how to manage the multiple checkboxes/buttons with PHP.

FYI: Don't mind some of the HTML is in Danish.

This is my HTML:

 <form action="assets/helpers/email.php" method="post">             
   
   iPhone model<br><br>
                         <div class="btn-group" data-toggle="buttons" >
    <button type="button" class="btn btn-primary"> <input type="checkbox" value="5" name"5" id="5">iPhone 5/5S</button>
    <button type="button" class="btn btn-primary"> <input type="checkbox" value="6" name"6" id="6">iPhone 6</button>
    <button type="button" class="btn btn-primary"> <input type="checkbox" value="6p" name"6p" id="6p">iPhone 6 Plus</button>


    </div>
    <br>    <br>
    <br>

  
   Bumper model<br><br>
    <div class="btn-group" data-toggle="buttons" >
    <button type="button" class="btn btn-primary"><input type="checkbox" value="FK" name"FK">Firkantet</button>
    <button type="button" class="btn btn-primary"><input type="checkbox" value="RU" name"RU">Rund</button>

    </div>
    <br>
    <br>
        <br>

   Lås<br><br>
    <div class="btn-group" data-toggle="buttons">
    <button type="button" class="btn btn-primary"><input type="checkbox" value="US" name"FL">Flet</button>
    <button type="button" class="btn btn-primary"><input type="checkbox" value="MS" name"SK">Skruer</button>
    </div>
    
    
 
<br>   <br> <br>


   Farve<br><br>
<div class="btn-group" data-toggle="buttons">
    <button type="button" class="btn btn-primary"><input type="checkbox" value="BA" name"BA">Sort</button>
    <button type="button" class="btn btn-primary"><input type="checkbox" value="SI" name"SI">Sølv</button>    
    <button type="button" class="btn btn-primary"><input type="checkbox" value="GR" name"GR">Grå</button>
 <button type="button" class="btn btn-primary"><input type="checkbox" value="CH" name"CH">Champagne</button>

    </div>
    <br>    <br>

              
<br/>
<input type='text' name='email' placeholder="Din email" />
</p>
<input type='submit' name='submit' value='Skriv mig op' />
</form>

Thanks for your answers, I really appreciate it. What would be more useful would be some basic step-by-step instructions on how to make this form (i.e. where to put the code, where to enter my checkbox names, how to check if it works, etc.). As I said, I know almost nothing about PHP. For example: I've tried some of the solutions from this topic: [link](http://stackoverflow.com/questions/2268887/how-do-i-see-which-checkbox-is-checked), but nothing happens when I press the submit button. — Christian Ellehammer, Mar 13 '15 at 11:39

score 0 · Answer 1 · answered Mar 11 '15 at 22:32

0

Inside email.php I would begin by dumping the form post results to the screen so you can see the structure of the post associative array and how data is labeled. The post variables are in $_POST.

I like to do it like this:

echo '<pre>';
print_r($_POST);
echo '</pre>';

Of course this is just a starting point, but hopefully it gets you headed in the right direction.

answered Mar 11 '15 at 22:32

John McMahon

1,605
1
16
21

Now I see what you mean. After messing around with the *name*, *id* and *value* tags, in correspondence to this [tutorial](http://www.html-form-guide.com/php-form/php-form-validation-tutorial.html), I get the correct output, as of if the checkboxes are checked or not, as shown in the example in the link. – Christian Ellehammer Mar 13 '15 at 13:13

score 0 · Answer 2 · answered Mar 12 '15 at 07:19

0

Your name attributes in html form are sent with values to your mail.php script. To get to a specific value in your script you need to call for it like this: $_POST['*nameofinput*']. If the checkbox isn't checked the value won't be sent.

You can test if a checkbox was checked in PHP like this

  if ((isset($_POST['checkboxname']))&&($_POST['checkboxname']!=''))
{
//do something if it was checked
//assign it to something for example
 $mycheckedbox = $_POST['checkboxname'];
}

To mail stuff i recommend using PHPMailer (http://phpmailer.worxware.com/). Feel free to ask more specific questions.

answered Mar 12 '15 at 07:19

Foogley

3
3

I've tried to put the code and replaced *checkboxname* with *5*, but it doesn't seem to work. Nothing happens/shows in the output. – Christian Ellehammer Mar 13 '15 at 13:17
The code i wrote doesn't output anything. Use: echo $mycheckedbox; – Foogley Mar 14 '15 at 14:27

score 0 · Accepted Answer · edited May 23 '17 at 11:56

Since my last activity in this thread, I've managed to get it all to work with this code:

form action="assets/helpers/mysql.php" method="post">
                
                     
                      

<div class="row">
     <div class="col-md-6 col-s-12"><h2>Headline 2<strong>Bumper</strong>.</h2>
        <p> Lorem ipsum dolor sit amet, elit id fermentum tempor condimentum et, eros metus sed massa. Taciti interdum, suscipit laoreet felis ac vivamus enim. Sagittis vitae, ut turpis enim quis congue, erat orci pulvinar pellentesque morbi phasellus. Erat mi non fringilla non unde vulputate. Montes nulla, dolor quis suspendisse libero arcu donec metus, arcu scelerisque sed wisi et pellentesque, ipsum auctor praesent nulla, mi pellentesque in. Integer ipsum nunc posuere aliquam sit maecenas, proin pellentesque velit wisi orci, phasellus suspendisse. Est purus lorem malesuada vivamus, tempus lectus, augue mattis adipiscing nullam. Penatibus sapien sit ut a mollis, amet imperdiet sed fermentum ipsum, laoreet sem lectus, et fringilla est. In tortor felis leo tristique nec, convallis condimentum integer ut eget, placerat mi sem. Vestibulum platea porttitor. Non posuere a, posuere lectus et id et, commodo semper volutpat. Amet diam, eget enim feugiat rutrum accumsan, molestie suspendisse.
</p>
<br><br>
        </div>
   
<div class="col-md-6 col-s-12">
        
        <h2>Hvilken <strong>Bumper</strong><br>kunne du tænke dig?</h2>
        


<h3>iPhone model</h3>

           
           <div class="btn-group" data-toggle="buttons" >
<button type="button" class="btn btn-primary"> 
<input type="checkbox" name='iPhone[]' value="iPhone 5" id="iPhone 5">iPhone 5/5S</button>

<button type="button" class="btn btn-primary"> 
<input type="checkbox" name='iPhone[]' value="iPhone 6" id="iPhone 6">iPhone 6</button>

<button type="button" class="btn btn-primary"> 
<input type="checkbox" name='iPhone[]' value="iPhone 6 Plus" id="iPhone 6 Plus">iPhone 6 Plus</button>
    </div>
<br>    
<br>

        

<h3>Bumper model</h3
    ><p></p>

            <div class="btn-group" data-toggle="buttons" >
    <button type="button" class="btn btn-primary">
    <input type="checkbox" name='Bumper[]' value="Firkantet" id="Firkantet">Firkantet</button>
    
    <button type="button" class="btn btn-primary">
    <input type="checkbox" name='Bumper[]' value="Rund" id="Rund">Rund</button>
            </div>
    
    
<br>
<br>
<h3>Lås</h3>
    <p></p>
    
            <div class="btn-group" data-toggle="buttons">
    <button type="button" class="btn btn-primary">
    <input type="checkbox" name='Laas[]' value="Flet"  id="Flet">Flet</button>
    
    <button type="button" class="btn btn-primary">
    <input type="checkbox" name='Laas[]' value="Skruer" id="Skruer">Skruer</button>
            </div> 
  
<br>
<br>
<h3>Farve</h3>
    <p></p>

 <div class="btn-group" data-toggle="buttons">
<button type="button" class="btn btn-primary">
<input type="checkbox" name='Farve[]' value="Sort" id="Sort">Sort</button>

<button type="button" class="btn btn-primary">
<input type="checkbox" name='Farve[]' value="Sølv" id="Sølv">Sølv</button>
    
<button type="button" class="btn btn-primary">
<input type="checkbox" name='Farve[]' value="Grå" id="Grå">Grå</button>

<button type="button" class="btn btn-primary">
<input type="checkbox" name='Farve[]' value="Champagne" id="Champagne">Champagne</button>

 </div>


    </div>    </div>
<br><br>
<div class="row row-centered">
<div class="col-md-12 col-s-12 col-centered signup">
<div class="item"><div class="content">
<h2>Skriv <strong>mig</strong> op!</h2>
<input type='text' name='name' placeholder="Navn"/>
<br><br>
<input type='text' name='email' placeholder="Email"/>

<br><br><strong><input type='submit' class="btn btn-danger" name='Submit' value='Send' /></strong>
</div></div>
</form>

But now i need the buttons/checkboxes to be inserted in a MySQL database. For that i've created a new question: Insert values of multiple checkboxes into MySQL database

PHP form with multiple checkboxes/Bootstrap buttons

3 Answers3