2017-05-25 33 views
0

我剛剛創建了一個很好的工具來計算結果(通過電子郵件添加,乘以和發送總數)爲通用麪包店。使用php,ajax和javascript計算訂單的結果,複選框不起作用

我的問題是,我無法獲得我的複選框輸入內的值。我嘗試了幾種方法,但是我能從無線電覆選框中獲得的唯一價值是1(我認爲這個值非常「真實」)。其他一切正在工作,但我仍然覺得它有點冗長。

這裏是我的代碼:

的HTML(問題):

<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的(問題):

$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:我的代碼並在此頁上的工作:

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

整個代碼(忽略它,只有用於調試目的或用於建議)

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

的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); 
    } 

}); 

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

回答

1

在JavaScript submitForm()功能不包括提交 「行政」, 「好客」, 「衝剪」 的,「刨切「或」奶酪「字段。

在您的數據串,它們不存在...

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, 

這意味着這些領域都從未提交給PHP表單處理程序,所以這就是爲什麼你不能從他們那裏得到任何東西。

並非每次輸入自己賦值給一個變量,然後起草數據串的複雜和冗長的方法,爲什麼不嘗試一個更簡單,更面向未來的方法,如...

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

太棒了!接得好! – Matto

+0

我會嘗試一下序列化方法。我是否必須與網址結合使用,還是隻需要發送數據? – Matto

+0

有什麼類似的PHP來獲得一堆價值? – Matto

1

錯誤應該在你的PHP裏面。

對於以布爾值爲值的複選框值,如果使用該類型的檢查,那麼當複選框爲false時,您將無法進入if內部。

嘗試從這個改變你的複選框檢查:

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

這樣:

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

或許你您的問題解決。

p.s.空從PHP官方文檔這裏DOC:

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

對於特定價值我只使用 :$ value = implode(',',$ _POST ['Executive']); 我使用其他方法的所有其他值(驗證名稱,等等) – Matto

+0

是$ _POST ['執行']複選框的值?還是他們都是價值觀? – quirimmo

+1

似乎在JavaScript中的發佈數據中沒有一個名爲「Executive」的參數,您確定要發送它嗎?並且是複選框的所有值還是隻有一個? – quirimmo