クローンアイテムをPHPのjavascriptで送信する

Question

私のアイデアは注文フォームを作成することです。私はフォームを作成し、私はクリックして、新しい製品を選択する新しいフィールドを作成したい場合は、フィールドの製品と数量をクローンするためにjavascriptを使いました。彼が望む多くの製品を選択することができます。問題は、PHPを使ってクローンされたこの情報を電子メールに送る方法を知らないことです。 私のコードは次のとおり

function addInput(divName) { 
 
    var copy = document.getElementById('forclone').cloneNode(true); 
 
    document.getElementById(divName).appendChild(copy); 
 
}

<form method="post" id="onlineorder" action="sendform.php"> 
 
    <fieldset id="listproducts"> 
 
    <legend>PRODUCTS</legend> 
 
    <div id='forclone'> 
 
     <select name="product" id="product"> 
 
     <optgroup label="PRODUCT 1"> 
 
      <option>PRODUCT 1 - BLUE</option> 
 
      <option>PRODUCT 1 - RED</option> 
 
      <option>PRODUCT 1 - YELLOW</option> 
 
     </optgroup> 
 

 
     <optgroup label="PRODUCT 2"> 
 
      <option>PRODUCT 2 - WHITE</option> 
 
      <option>PRODUCT 2 - BLACK</option> 
 
      <option>PRODUCT 2 - GRAY</option> 
 
     </optgroup> 
 

 

 
     </select> 
 

 
     &nbsp; 
 
     <label for="quantity">Quantity:<span style="color:red">*</span> 
 
     </label>&nbsp; 
 
     <input type="number" name="quantity" id="quantity" placeholder="Qnt" min="0" max="9999" required/> 
 
    </div> 
 

 
    <div id="dynamicinput"></div> 
 
    <input type="button" value="New Product" onclick="addInput('dynamicinput');" /> 
 
    </fieldset> 
 
    <p></p> 
 
    <input type="submit" value="SUBMIT"> 
 
</form>

PHP（sendform.php）

<?php 

if(isset($_POST['email'])) { 



$email_to = "email@domain.com"; 

$email_subject = "[ Online Order ]"; 


function died($error) { 


    echo "We are very sorry, but there were error(s) found with the form you submitted. "; 

    echo "These errors appear below.<br /><br />"; 

    echo $error."<br /><br />"; 

    echo "Please go back and fix these errors.<br /><br />"; 

    die(); 

} 



if(!isset($_POST['name']) || 

    !isset($_POST['business']) || 

    !isset($_POST['email']) || 

    !isset($_POST['phone']) || 

    !isset($_POST['quantity']) || 

    !isset($_POST['product'])) { 

    died('We are sorry, but there appears to be a problem with the form you submitted.'); 

} 



$name = $_POST['name']; // required 

$business = $_POST['business']; // required 

$email_from = $_POST['email']; // required 

$phone = $_POST['phone']; // not required 

$quantity = $_POST['quantity']; // required 

$product = $_POST['product']; // not required 



$error_message = ""; 

$email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/'; 

if(!preg_match($email_exp,$email_from)) { 

    $error_message .= 'The Email Address you entered does not appear to be valid.<br />'; 

} 


if(strlen($error_message) > 0) { 

    died($error_message); 

} 

$email_message = "<strong>You received an online order. <br>Follow below the informations.</strong><br><br>\n\n"; 



function clean_string($string) { 

    $bad = array("content-type","bcc:","to:","cc:","href"); 

    return str_replace($bad,"",$string); 

} 



$email_message .= "<br><strong>Name: </strong>".clean_string($name)."\n"; 

$email_message .= "<br><strong>Business: </strong>".clean_string($business)."\n"; 

$email_message .= "<br><strong>Email: </strong>".clean_string($email_from)."\n"; 

$email_message .= "<br><strong>Phone: </strong>".clean_string($phone)."\n"; 

$email_message .= "<br><br><strong>ORDER: </strong>\n"; 

$email_message .= "<br><br><strong>Qty: </strong>".clean_string($quantity)."\n"; 

$email_message .= "&nbsp;&nbsp;<strong>Product: </strong>".clean_string($product)."\n"; 





$headers = "Content-Type: text/html; charset= UTF-8 \r\n"; 
$headers .= 'From: '.$email_from."\r\n". 

    'Reply-To: '.$email_from."\r\n" . 

    'X-Mailer: PHP/' . phpversion(); 

@mail($email_to, $email_subject, $email_message, $headers); 

?> 


<p>Thank you for order. We will contact you as soon as possible.</p> 
<p>You can close this page now.</p> 


<?php 

} 

?> 

Answer 1

一つの可能​​性は、多数のいくつかの増加にクローニングされたノードのアイテムの名前を変更することですproduct1,product2などのように、電子メールのforループに入れます。例えば
（これは未テストです）：

$email = ''; 
for($i = 1; isset($_POST['product'.$i]); $i+=1){ 
    $email .= $_POST['product'.$i]; 
} 
$email_message .= $email; 

あなたがしなければならないのは、JavaScriptで行われたクローンの量の実行中の集計を維持し、名前の最後にその番号を追加しています。

私はデモのためにあなたのコードを使用している

var runningproducttally = 1; 

function addInput(divName) { 
    var copy = document.getElementById('forclone').cloneNode(true); 
    var select1 = copy.getElementsByTagName('select')[0]; 
    select1.setAttribute("name","product"+runningproducttally); 
    document.getElementById(divName).appendChild(copy); 
    runningproducttally++; 
} 

Answer 2

：あなたのHTMLで ：

<script type="text/javascript"> 
    function addInput(divName) { 
     var copy = document.getElementById('forclone').cloneNode(true); 
     document.getElementById(divName).appendChild(copy); 
    } 
</script> 

<form method="post" id="onlineorder" action="sendform.php"> 
      <fieldset id="listproducts"> 
      <legend>PRODUCTS</legend> 
      <div id='forclone'> 
       <select name="product" id="product[]"> 
       <optgroup label="PRODUCT 1"> 
        <option>PRODUCT 1 - BLUE</option> 
        <option>PRODUCT 1 - RED</option> 
        <option>PRODUCT 1 - YELLOW</option> 
       </optgroup> 

       <optgroup label="PRODUCT 2"> 
        <option>PRODUCT 2 - WHITE</option> 
        <option>PRODUCT 2 - BLACK</option> 
        <option>PRODUCT 2 - GRAY</option> 
       </optgroup> 


       </select> 

       &nbsp; 
       <label for="quantity">Quantity:<span style="color:red">*</span> 
       </label>&nbsp; 
       <input type="number" name="quantity" id="quantity" placeholder="Qnt" min="0" max="9999" required/> 
      </div> 

      <div id="dynamicinput"></div> 
      <input type="button" value="New Product" onclick="addInput('dynamicinput');" /> 
      </fieldset> 
      <p></p> 
      <input type="submit" value="SUBMIT"> 
     </form> 

あなたの中にPHP sendform.php：は

$products = $_REQUEST['product'];