2017-05-25 1 views
0

Je viens de créer un joli outil pour calculer le résultat (ajouter, multiplier et envoyer le total par email) pour une boulangerie générique.Calculer le résultat d'une commande avec php, ajax et javascript, les cases à cocher ne fonctionnent pas

Mon problème est que je ne suis pas en mesure d'obtenir la valeur dans mes entrées checkbox. J'ai essayé d'une certaine manière mais la seule valeur que j'ai pu obtenir de la case à cocher radio était 1 (je suppose que la valeur même est un "vrai"). Tout le reste fonctionne mais je le trouve encore un peu bavard.

Voici mon code:

HTML (problème):

<fieldset> 
         <label>MEAT & CHEESE TRAYS</label><br> 
         <label>Executive Tray</label><br> 
         <label class='radiolabel'><input type="checkbox" name="Executive[]" value="45">Serves 10–15 people</label><br/> 
         <label class='radiolabel'><input type="checkbox" name="Executive[]" value="62">Serves 20–25 people</label><br/> 
         <label>Hospitality Tray</label><br> 
         <label class='radiolabel'><input type="checkbox" name="Hospitality[]" value="48">Serves 10–15 people</label><br/> 
         <label class='radiolabel'><input type="checkbox" name="Hospitality[]" value="65">Serves 20–25 people</label><br/> 
         <label>Meat & Cheese Nibbler</label><br> 
         <label class='radiolabel'><input type="checkbox" name="Nibbler[]" value="48">Serves 10–15 people</label><br/> 
         <label class='radiolabel'><input type="checkbox" name="Nibbler[]" value="65">Serves 20–25 people</label><br/> 
         <label>Sliced Cheese Tray</label><br> 
         <label class='radiolabel'><input type="checkbox" name="Sliced[]" value="48">Serves 10–15 people</label><br/> 
         <label class='radiolabel'><input type="checkbox" name="Sliced[]" value="65">Serves 20–25 people</label><br/> 
         <label>Cheese Nibbler</label><br> 
         <label class='radiolabel'><input type="checkbox" name="Cheese[]" value="48">Serves 10–15 people</label><br/> 
         <label class='radiolabel'><input type="checkbox" name="Cheese[]" value="65">Serves 20–25 people</label><br/> 
        </fieldset> 

PHP LE (problème):

$value = implode(',', $_POST['Executive']); 
$Body = ""; 
$Body .= "Here's the order from: "; 

$Body .= "Executive Tray: "; 
$Body .= $value; 
$Body .= print_r($value); 
$Body .= "\n"; 
$Body .= "Hospitality Tray: "; 
$success = mail($EmailTo, $Subject, $Body, "From:".$email); 

LINK: Mon code est et travailler sur cette page:

http://wilsonpools.larchedigitalmedia.com/foxbakapp/

CODE ENTIER (ignorer, uniquement pour le débogage ou pour quelques suggestions)

HTML:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Contact Form Foxs</title> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
    <link rel="stylesheet" href="style.css"> 
</head> 
<body> 
    <div class="container"> 
     <form id="calculatoform" role="form"> 
      <fieldset> 
       <legend>Contact Details</legend> 
       <div class="form-group"> 
        <label for='firstname'>Name</label> 
        <input type="text" class="form-control" name='firstname' id="firstname" placeholder="Enter name" required data-error="Please, insert your name"> 
        <div class="help-block with-errors"></div> 
       </div> 
       <div class="form-group"> 
        <label for='address'>Address</label> 
        <input type="text" class="form-control" id='address' name='address' id="firstname" placeholder="Enter name" required data-error="Please, insert your address"> 
        <div class="help-block with-errors"></div> 
       </div> 
       <div class="form-group"> 
        <label for='company'>Company</label> 
        <input type="text" class="form-control" id='company' name='company' placeholder="Enter name" data-error="Please insert your company"> 
        <div class="help-block with-errors"></div> 
       </div> 
       <div class="form-group"> 
        <label for='phonenumber'>Phone Number</label> 
        <input type="text" class="form-control" id="phonenumber" name='phonenumber' placeholder="Enter Your Phone Number" data-error="Please enter your phone number" required> 
        <div class="help-block with-errors"></div> 
       </div> 
       <div class="form-group"> 
        <label for='email'>Email</label> 
        <input type="email" name='email' class="form-control" id="email" placeholder="Enter email" data-error="Please enter your email" required> 
        <div class="help-block with-errors"></div> 
       </div> 
      </fieldset> 
      <div> 
       <div class="cont_order"> 
        <fieldset> 
         <legend>Place Your order</legend> 
         <fieldset> 
          <label>SANDWICH TRAYS</label><br> 
          <label>Small Sandwiches</label><br> 
          <input type="number" name="smallsan"><br> 
          <label>Large Sandwiches</label><br> 
          <input type="number" name="largesan"><br> 
         </fieldset> 
         <fieldset> 
          <label>MEAT & CHEESE TRAYS</label><br> 
          <label>Executive Tray</label><br> 
          <label class='radiolabel'><input type="checkbox" name="Executive[]" value="45">Serves 10–15 people</label><br/> 
          <label class='radiolabel'><input type="checkbox" name="Executive[]" value="62">Serves 20–25 people</label><br/> 
          <label>Hospitality Tray</label><br> 
          <label class='radiolabel'><input type="checkbox" name="Hospitality[]" value="48">Serves 10–15 people</label><br/> 
          <label class='radiolabel'><input type="checkbox" name="Hospitality[]" value="65">Serves 20–25 people</label><br/> 
          <label>Meat & Cheese Nibbler</label><br> 
          <label class='radiolabel'><input type="checkbox" name="Nibbler[]" value="48">Serves 10–15 people</label><br/> 
          <label class='radiolabel'><input type="checkbox" name="Nibbler[]" value="65">Serves 20–25 people</label><br/> 
          <label>Sliced Cheese Tray</label><br> 
          <label class='radiolabel'><input type="checkbox" name="Sliced[]" value="48">Serves 10–15 people</label><br/> 
          <label class='radiolabel'><input type="checkbox" name="Sliced[]" value="65">Serves 20–25 people</label><br/> 
          <label>Cheese Nibbler</label><br> 
          <label class='radiolabel'><input type="checkbox" name="Cheese[]" value="48">Serves 10–15 people</label><br/> 
          <label class='radiolabel'><input type="checkbox" name="Cheese[]" value="65">Serves 20–25 people</label><br/> 
         </fieldset> 
         <fieldset> 
          <label>SPECIALTY TRAYS</label><br> 
          <label>Breakfast Delights</label><br> 
          <input type="number" name="delights">$4.30 per person (2 pieces/person)<br> 
          <label>Bagel Tray</label><br> 
          <input type="number" name="bagel">$4.10 per person<br> 
          <label>Spinach Dip Platters</label><br> 
          <input type="number" name="spinach">$17.99 each<br> 
          <label class='radiolabel'><input type="checkbox" name="alligatorbread" value="3">Alligator or Turtle Bread add $3.00</label><br/> 
          <label>Party Ideas</label><br> 
          <input type="number" name="party">$5.99 each<br> 
          <label>Sweet Treats</label><br> 
          <input type="number" name="sweet">$1.55 per person (1.5 pieces/person)<br> 
          <label>Beverages & Extras</label><br> 
          <input type="number" name="soft">Soft Drinks (355mL)<br> 
          <input type="number" name="chocolate">Chocolate Milk (500mL)<br> 
          <input type="number" name="white">White Milk 2% (500mL)<br> 
          <input type="number" name="pickle">Huge Dill Pickle (Whole or Quartered)<br> 
         </fieldset> 
         <p id='totalPrice'>0</p> 
        </fieldset> 
       </div> 
       <input type='submit' id='submit' value='Validate!'> 
      </div> 
     </form> 
    </div> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script type="text/javascript" src="js/formcalculations.js"></script> 
    <script src="js/validator.min.js"></script> 
</body> 
</html> 

LE JAVASCRIPT (JQUERY):

$(document).ready(function() { 
    var grandtotal = function() { 
     var total = 0; 
     $('input:checkbox:checked').each(function(){ 
      total += isNaN(parseFloat($(this).val())) ? 0 : parseFloat($(this).val()); 
     }); 
     var small = $('[name="smallsan"]').val()*3.65; 
     var large = $('[name="largesan"]').val()*4.05; 
     var delights = $('[name="delights"]').val()*4.30; 
     var bagel = $('[name="bagel"]').val()*4.10; 
     var spinach = $('[name="spinach"]').val()*4.10; 
     var party = $('[name="party"]').val()*5.99; 
     var sweet = $('[name="sweet"]').val()*1.55; 
     var soft = $('[name="soft"]').val()*1.25; 
     var chocolate = $('[name="chocolate"]').val()*1.59; 
     var white = $('[name="white"]').val()*1.39; 
     var pickle = $('[name="pickle"]').val()*1.30; 
     $("#totalPrice").html(small + large + total + delights + bagel + spinach + party + sweet + soft + chocolate + white + pickle); 
     // console.log(small + large + total + delights + bagel + spinach + party + sweet + soft + chocolate + white + pickle); 
    } 
    // var grandtotal = grandtotal(); 
    $('input').change(function() { 
     grandtotal(); 
    }); 

    $("#calculatoform").validator().on("submit", function (event) { 
     if (event.isDefaultPrevented()) { 
      formError(); 
      submitMSG(false, "Did you fill in the form properly?"); 
     } else { 
      event.preventDefault(); 
      submitForm(); 
     } 
    }); 

    function submitForm(){ 
     var firstname = $("#firstname").val(); 
     var address = $("#address").val(); 
     var company = $("#company").val(); 
     var email = $("#email").val(); 
     var phonenumber = $("#phonenumber").val(); 
     var small = $('[name="smallsan"]').val(); 
     var large = $('[name="largesan"]').val(); 
     var delights = $('[name="delights"]').val(); 
     var bagel = $('[name="bagel"]').val(); 
     var spinach = $('[name="spinach"]').val(); 
     var party = $('[name="party"]').val(); 
     var sweet = $('[name="sweet"]').val(); 
     var soft = $('[name="soft"]').val(); 
     var chocolate = $('[name="chocolate"]').val(); 
     var white = $('[name="white"]').val(); 
     var pickle = $('[name="pickle"]').val(); 
     $.ajax({ 
      type: "POST", 
      url: "submitform.php", 
      data: "firstname=" + firstname + "&email=" + email + "&company=" + company + "&phonenumber=" + phonenumber + "&address=" + address + "&small=" + small + "&large=" + large + "&delights=" + delights + "&bagel=" + bagel + "&spinach=" + spinach + "&party=" + party + "&sweet=" + sweet + "&soft=" + soft + "&chocolate=" + chocolate + "&white=" + white + "&pickle=" + pickle, 
      success : function(text){ 
       if (text == "success"){ 
        formSuccess(); 
       } else { 
        formError(); 
       } 
      } 
     }); 
    } 

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

    function formError(){ 

    } 

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

}); 

LE PHP:

<?php 

$errorMSG = ""; 

if (empty($_POST["firstname"])) { 
    $errorMSG = "Name is required "; 
} else { 
    $firstname = $_POST["firstname"]; 
} 

if (empty($_POST["email"])) { 
    $errorMSG .= "Email is required "; 
} else { 
    $email = $_POST["email"]; 
} 

if (empty($_POST["company"])) { 
    $errorMSG .= "Message is required "; 
} else { 
    $company = $_POST["company"]; 
} 

if (empty($_POST["address"])) { 
    $errorMSG .= "Message is required "; 
} else { 
    $address = $_POST["address"]; 
} 

if (empty($_POST["phonenumber"])) { 
    $errorMSG .= "Message is required "; 
} else { 
    $phonenumber = $_POST["phonenumber"]; 
} 

$small = $_POST["small"]; 

$large = $_POST["large"]; 

$delights = $_POST["delights"]; 

$bagel = $_POST["bagel"]; 

$spinach = $_POST["spinach"]; 

$party = $_POST["party"]; 

$sweet = $_POST["sweet"]; 

$soft = $_POST["soft"]; 

$chocolate = $_POST["chocolate"]; 

$white = $_POST["white"]; 

$pickle = $_POST["pickle"]; 

$value = implode(',', $_POST['Executive']); 

$hospitality = $_POST["Hospitality"]; 

$nibbler = $_POST["Nibbler"]; 

$sliced = $_POST["Sliced"]; 

$cheese = $_POST["Cheese"]; 

$EmailTo = "[email protected]"; 
$Subject = "Order from" . $firstname; 

// prepare email body text 
$Body = ""; 
$Body .= "Here's the order from: "; 
$Body .= "Name: "; 
$Body .= $firstname; 
$Body .= "\n"; 
$Body .= "Email: "; 
$Body .= $email; 
$Body .= "\n"; 
$Body .= "Company: "; 
$Body .= $company; 
$Body .= "\n"; 
$Body .= "Address: "; 
$Body .= $address; 
$Body .= "\n"; 
$Body .= "Phone: "; 
$Body .= $phonenumber; 
$Body .= "\n"; 

$Body .= "Executive Tray: "; 
$Body .= $value; 
$Body .= print_r($value); 
$Body .= "\n"; 
$Body .= "Hospitality Tray: "; 
$Body .= $hospitality; 
$Body .= "\n"; 
$Body .= "Meat & Cheese Nibbler: "; 
$Body .= $nibbler; 
$Body .= "\n"; 
$Body .= "Sliced Cheese Tray: "; 
$Body .= $sliced; 
$Body .= "\n"; 
$Body .= "Cheese Nibbler: "; 
$Body .= $cheese; 
$Body .= "\n"; 

$Body .= "SANDWICH TRAYS Small version: "; 
$Body .= $small; 
$Body .= "\n"; 
$Body .= "SANDWICH TRAYS Large version: "; 
$Body .= $large; 
$Body .= "\n"; 
$Body .= "Breakfast Delights: "; 
$Body .= $delights; 
$Body .= "\n"; 
$Body .= "Bagel Tray: "; 
$Body .= $bagel; 
$Body .= "\n"; 
$Body .= "Spinach Dip Platters: "; 
$Body .= $spinach; 
$Body .= "\n"; 
$Body .= "Party Ideas: "; 
$Body .= $party; 
$Body .= "\n"; 
$Body .= "Sweet Treats: "; 
$Body .= $sweet; 
$Body .= "\n"; 
$Body .= "Beverages & Extras: "; 
$Body .= "Soft Drinks: "; 
$Body .= $soft; 
$Body .= "\n"; 
$Body .= "Chocolate Milk: "; 
$Body .= $chocolate; 
$Body .= "\n"; 
$Body .= "White Milk: "; 
$Body .= $white; 
$Body .= "\n"; 
$Body .= "Huge Dill Pickle: "; 
$Body .= $pickle; 
$Body .= "\n"; 
$Body .= "For a gran total of: "; 
$Body .= $small + $large + $delights + $bagel + $spinach + $party + $sweet + $soft + $chocolate + $white + $pickle; 
$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; 
    } 
} 
?> 

Répondre

1

En fonction javascript submitForm() vous ne pas inclure la présentation du "exécutif", "accueil", "grignoteuse", « tranches "ou" champs de fromage ".

Dans votre chaîne de données n'existent pas ...

data: "firstname=" + firstname + "&email=" + email + "&company=" + company + "&phonenumber=" + phonenumber + "&address=" + address + "&small=" + small + "&large=" + large + "&delights=" + delights + "&bagel=" + bagel + "&spinach=" + spinach + "&party=" + party + "&sweet=" + sweet + "&soft=" + soft + "&chocolate=" + chocolate + "&white=" + white + "&pickle=" + pickle, 

Cela signifie que ceux des champs ne sont jamais soumis au gestionnaire de formulaire PHP, c'est pourquoi vous ne pouvez pas obtenir quoi que ce soit d'eux.

au lieu de la méthode complexe et prolixe d'assigner chaque entrée à une variable, puis l'élaboration de la chaîne de données vous-même, pourquoi ne pas essayer une méthode plus simple et la preuve plus d'avenir tels que ...

var datastring = $("#calculatoform").serialize(); 
    $.ajax({ 
     type: "POST", 
     url: "submitform.php", 
     data: datastring, 
     success : function(text){ 
      if (text == "success"){ 
       formSuccess(); 
      } else { 
       formError(); 
      } 
     } 
    }); 
+0

Super! Bonne prise! – Matto

+0

Je vais essayer la méthode sérialiser. Est-ce que je dois combiner avec l'url ou ai-je seulement besoin de cela pour envoyer des données? – Matto

+0

Y at-il quelque chose de similaire en PHP pour obtenir un tas de valeur? – Matto

1

L'erreur devrait être dans votre PHP.

Pour les valeurs de case à cocher, qui ont des valeurs booléennes, si vous utilisez ce type de vérification, vous ne pourrez pas entrer dans la case if si la case est fausse.

Essayez de changer votre chèque pour les cases de cette:

if (empty($_POST["checkboxName"])) { 
    $errorMSG .= "Message is required "; 
} else { 
    $checkboxName = $_POST["checkboxName"]; 
} 

à ceci:

if (isset($_POST["checkboxName"])) { 
    $errorMSG .= "Message is required "; 
} else { 
    $checkboxName = $_POST["checkboxName"]; 
} 

et vous pouvez avoir votre numéro fixe.

p.s. Ici doc de vide de docs PHP officiels:

Determine whether a variable is considered to be empty. A variable is considered empty if it does not exist or if its value equals FALSE.

http://php.net/manual/en/function.empty.php

+0

Pour cela particulier valeur que je n'ai utilisée que : $ value = implode (',', $ _POST ['Executive']); J'ai utilisé l'autre méthode pour toutes les autres valeurs (pour valider le nom, et ainsi de suite) – Matto

+0

est $ _POST ['Executive'] la valeur d'une case à cocher? ou sont-ils toutes les valeurs? – quirimmo

+1

il semble que dans vos données de poste en JavaScript, il n'y a pas de paramètre appelé 'Executive' êtes-vous sûr de l'envoyer? et est-ce que toutes les valeurs des cases à cocher ou une seule? – quirimmo