Send multiple checkbox using ajax and php

working on sending HTML form data to email using PHP and ajax… everything is working fine but facing problems with check boxes… check box data is not sending to email. Could any one can help to solve this

html content is Below

<div class="row">
<div class="col-sm-6 col-sm-offset-3">
    <div class="well" style="margin-top: 10%;">
    <h3>Send me a message</h3>
    <form role="form" id="contactForm" data-toggle="validator" class="shake">
        
    <div class="form-group ">
    <div class="form-group ">
      <label class="control-label col-sm-4" for="company_zip">Company ZIP</label>
      <div class="col-sm-8">
       <input class="form-control" id="company_zip" name="company_zip" placeholder="Company ZIP" type="text"/>
      </div>
     </div>
     <div class="form-group ">
      <label class="control-label col-sm-4" for="company_country">Company Country</label>
      <div class="col-sm-8">
       <input class="form-control" id="company_country" name="company_country" placeholder="Company Country" type="text"/>
      </div>
     </div>
     <div class="form-group ">
      <label class="control-label col-sm-4" for="office_phone">Office Phone<span class="asteriskField">* </span>
      </label>
      <div class="col-sm-8">
       <input class="form-control" id="office_phone" name="office_phone" placeholder="Office Phone" type="text" required/>
       <div class="help-block with-errors"></div>
      </div>
     </div>
     
     <div class="form-group ">
      <label class="control-label col-sm-4" for="email_address">Email Address<span class="asteriskField">*</span>
      </label>
      <div class="col-sm-8">
       <input type="email" class="form-control" id="email" placeholder="Enter email" required />
       <div class="help-block with-errors"></div>
      </div>
     </div>
    
     <div class="form-group ">
      <label class="control-label col-sm-4" for="location_country_city">Location-Country/City</label>
      <div class="col-sm-8">
       <input class="form-control" id="location_country_city" name="location_country_city" placeholder="Location-Country/City" type="text"/>
      </div>
     </div>
     <div class="form-group ">
      <label class="control-label col-sm-4 ">Services Requested <br> Please Pick Options
       <span class="asteriskField">*</span>
      </label>
      
      <div class="col-sm-8 ">
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Transportation"/>
         Transportation
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Tours"/>
         Tours
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Teambuilding"/>
         Teambuilding
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Entertainment"/>
         Entertainment
        </label>
       </div>
       
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Off-site Venue"/>
         Off-site Venue
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Housing/Hotel"/>
         Housing/Hotel
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Vacation Home"/>
         Vacation Home
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Registration"/>
         Registration
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Activities"/>
         Activities
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Staffing"/>
         Staffing
        </label>
       </div>
       <div class="checkbox">
        <label class="checkbox">
         <input name="services_requested[]" id="services_requested" type="checkbox" value="Other"/>
         Other
        </label>
       </div>
      </div>
     </div>
     <div class="row">
     <div class="form-group ">
      <label class="control-label col-sm-4" for="other_specified">Specify below </label>
       <div class="form-group col-sm-8">
            <textarea id="other_specified" class="form-control" rows="5" placeholder="Enter other" ></textarea>
        </div>
     </div>
       </div>
        <button type="submit" id="form-submit" class="btn btn-success btn-lg pull-right ">Submit</button>
        <div id="msgSubmit" class="h3 text-center hidden"></div>
        <div class="clearfix"></div>
    </form>
    </div>`

and javascript

$("#contactForm").validator().on("submit", function (event) {
    if (event.isDefaultPrevented()) {
        // handle the invalid form...
        formError();
        submitMSG(false, "Did you fill in the form properly?");
    } else {
        // everything looks good!
        event.preventDefault();
        submitForm();
    }
});


function submitForm(){
    // Initiate Variables With Form Content
    var company_name = $("#company_name").val();
    var contact_name = $("#contact_name").val();
    var contact_title = $("#contact_title").val();
    var company_address = $("#company_address").val();
    var company_city = $("#company_city").val();
    var company_state = $("#company_state").val();
    var company_zip = $("#company_zip").val();
    var company_country = $("#company_country").val();
    var office_phone = $("#office_phone").val();
    var direct_phone = $("#direct_phone").val();
    var cell_phone = $("#cell_phone").val();
    var email = $("#email").val();
    var event_dates = $("#event_dates").val();
    var location_country_city = $("#location_country_city").val();
    var services_requested = $("#services_requested").val();
    var other_specified = $("#other_specified").val();
    

    $.ajax({
        type: "POST",
        url: "php/form-process.php",
        data: "company_name=" + company_name + "&contact_name=" + contact_name + "&contact_title=" + contact_title + "&company_address=" + company_address + "&company_city=" + company_city + "&company_state=" + company_state + "&company_zip=" + company_zip + "&company_country=" + company_country + "&office_phone=" + office_phone + "&direct_phone=" + direct_phone + "&cell_phone=" + cell_phone + "&email=" + email + "&event_dates=" + event_dates + "&location_country_city=" + location_country_city + "&services_requested=" + services_requested + "&other_specified=" + other_specified,
        success : function(text){
            if (text == "success"){
                formSuccess();
            } else {
                formError();
                submitMSG(false,text);
            }
        }
    });
}

function formSuccess(){
    $("#contactForm")[0].reset();
    submitMSG(true, "Message Submitted!")
}

function formError(){
    $("#contactForm").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
        $(this).removeClass();
    });
}

function submitMSG(valid, msg){
    if(valid){
        var msgClasses = "h3 text-center tada animated text-success";
    } else {
        var msgClasses = "h3 text-center text-danger";
    }
    $("#msgSubmit").removeClass().addClass(msgClasses).text(msg);
}

and PHP

<?php

$errorMSG = "";

// Company Name
if (empty($_POST["company_name"])) {
    $errorMSG = "Name is required ";
} else {
    $company_name = $_POST["company_name"];
}
// Contact Name
if (empty($_POST["contact_name"])) {
    $errorMSG .= "Contact Name is required ";
} else {
    $contact_name = $_POST["contact_name"];
}
// Contact Title
    $contact_title = $_POST["contact_title"];
    $company_address = $_POST["company_address"];
    $company_city = $_POST["company_city"];
    $company_state = $_POST["company_state"];
    $company_zip = $_POST["company_zip"];
    $company_country = $_POST["company_country"];
    $direct_phone = $_POST["direct_phone"];
    $cell_phone = $_POST["cell_phone"];
    $location_country_city = $_POST["location_country_city"];
    $services_requested = $_POST["services_requested"];
    $other_specified = $_POST["other_specified"];

// Office Phone
if (empty($_POST["office_phone"])) {
    $errorMSG .= "Office Phone is required ";
} else {
    $office_phone = $_POST["office_phone"];
}
// EMAIL
if (empty($_POST["email"])) {
    $errorMSG .= "Email is required ";
} else {
    $email = $_POST["email"];
}
// Event Dates
if (empty($_POST["event_dates"])) {
    $errorMSG .= "Event Dates is required ";
} else {
    $event_dates = $_POST["event_dates"];
}


$EmailTo = "test@xyzl.com";
$Subject = "New Message Received";

// prepare email body text
$Body = "";
$Body .= "Company Name: ";
$Body .= $company_name;
$Body .= "\n";
$Body .= "Contact Name: ";
$Body .= $contact_name;
$Body .= "\n";
$Body .= "Contact Title: ";
$Body .= $contact_title;
$Body .= "\n";
$Body .= "Company Address: ";
$Body .= $company_address;
$Body .= "\n";
$Body .= "Company City: ";
$Body .= $company_city;
$Body .= "\n";
$Body .= "Company State: ";
$Body .= $company_state;
$Body .= "\n";
$Body .= "Company Zip: ";
$Body .= $company_zip;
$Body .= "\n";
$Body .= "Company country: ";
$Body .= $company_country;
$Body .= "\n";
$Body .= "Office Phone: ";
$Body .= $office_phone;
$Body .= "\n";
$Body .= "Direct Phone: ";
$Body .= $direct_phone;
$Body .= "\n";
$Body .= "Cell Phone: ";
$Body .= $cell_phone;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $email;
$Body .= "\n";
$Body .= "Event Dates: ";
$Body .= $event_dates;
$Body .= "\n";
$Body .= "Location Country City: ";
$Body .= $location_country_city;
$Body .= "\n";
$Body .= "Requested Services: ";
$Body .= $services_requested;
$Body .= "\n";
$Body .= "Other Services: ";
$Body .= $other_specified;
$Body .= "\n";




// send email
$success = mail($EmailTo, $Subject, $Body, "From:".$email);

// redirect to success page
if ($success && $errorMSG == ""){
   echo "success";
}else{
    if($errorMSG == ""){
        echo "Something went wrong ";
    } else {
        echo $errorMSG;
    }
}

?>

thank you

Because there are multiple checkboxes, can you use the same id for each of them? I thought ids had to be unique within a page.

In any case, a post elsewhere suggests you should do something like:

var services_requested = $('.svcs:checked').serialize(),

and you should add class="svcs" to the input fields, or whatever class name you want to use.

Could you please tell me how to print this array in PHP… I tried many methods but just I am receiving array in my mail… Please help me… please have a look on my PHP code…
thank you

What do you get when you var_dump($_POST) in your PHP code? Doesn’t that show how to access the array elementS?

just I am receiving “array” word that’s it…

That suggests that $_POST['services_requested'] is an array, so you’ll have to iterate through the array to get each value from it. What happens if you var_dump($_POST['services_requested']) ?

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.