The form, except the usuall name, phone, email fields etc. I want it to have a dropdown with some products and a text box for the quantity.The point is that i want the user to be able to add more products(dropdown and text box for quantity) with a button.
I managed to do that with some Jquery script but when i send the email with php, the products that i add are not on the email that has been sent.
Here is html:
<!DOCTYPE html>
<html >
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body >
<form name="form1" id="form1" action="mail.php" method="POST">
Όνομα: <input type="text" name="name" size="20">
<br>
Email: <input type="text" name="email" size="20"> <br>
Νομός: <input type="text" name="nomos" size="20">
<br>
Περιοχή: <input type="text" name="perioxh" size="15">
<br>
Διέυθυνση <input type="text" name="address" size="15">
<br>
Τηλέφωνο: <input type="text" name="tel" size="9">
<br>
Δ.Ο.Υ: <input type="text" name="doy" size="9">
<div class="aromatika">
<div class="fotodiv"><img src="images/enoikiazomena-diamerismata- tinos-crystal-view-exwterikos-xwros-nuxta-1.jpg" width="100%" height="300px"></div>
<div class="input_wrap">
<select size="1" name="dropdown">
<option selected disabled>ΔΙΑΛΕΞΤΕ ΦΥΤΟ </option>
<option value="ΑΝΗΘΟΣ Φ17"> ΑΝΗΘΟΣ Φ17</option>
<option value="ΣΕΛΙΝΟ Φ17"> ΣΕΛΙΝΟ Φ17 </option>
<option value="ΜΑΪΝΤΑΝΟΣ Φ17"> ΜΑΪΝΤΑΝΟΣ Φ17 </option>
<option value="ΑΡΜΠΑΡΟΡΙΖΑ Φ17"> ΑΡΜΠΑΡΟΡΙΖΑ Φ17 </option>
<option value="ΑΡΤΕΜΙΣΙΑ Φ17"> ΑΡΤΕΜΙΣΙΑ Φ17 </option>
<option value="ΑΠΗΓΑΝΟΣ Φ17"> ΑΠΗΓΑΝΟΣ Φ17 </option>
<option value="ΒΑΣΙΛΙΚΟΣ Φ17"> ΒΑΣΙΛΙΚΟΣ Φ17 </option>
<option value="ΔΥΟΣΜΟΣ Φ17"> ΔΥΟΣΜΟΣ Φ17 </option>
<option value="ΔΕΝΤΡΟΛΙΒΑΝΟ Φ17"> ΔΕΝΤΡΟΛΙΒΑΝΟ Φ17 </option>
<option value="ΔΕΝΤΡΟΛΙΒΑΝΟ ΕΡΠΟΝ Φ17"> ΔΕΝΤΡΟΛΙΒΑΝΟ ΕΡΠΟΝ Φ17 </option>
<option value="ΔΕΝΤΡΟΛΙΒΑΝΟ ΗΜΙΕΡΠΟΝ Φ17"> ΔΕΝΤΡΟΛΙΒΑΝΟ ΗΜΙΕΡΠΟΝ Φ17 </option>
</select>
<div class="posotita">
Ποσοτητα <input type="text" size="1" name="text[]" class="form-control">
</div>
</div>
<button class="add_field_button btn btn-info">Προσθέστε προιόν</button>
</div>
<input type="submit" value="Αποστολή">
</form>
<div></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="scripts/script.js" type="text/javascript"></script>
</body>
</html>
And now the javascript :
var wrapper = $(".input_wrap>div");
var add_button = $(".add_field_button");
$(add_button).click(function (e) {
e.preventDefault();
$(wrapper).after('<div class="input_wrap"><select size="1" name="dropdown"><option selected disabled>ΔΙΑΛΕΞΤΕ ΦΥΤΟ </option>
<option value="ΑΝΗΘΟΣ Φ17"> ΑΝΗΘΟΣ Φ17</option>
<option value="selino"> ΣΕΛΙΝΟ Φ17 </option>
<option value="ΜΑΪΝΤΑΝΟΣ Φ17"> ΜΑΪΝΤΑΝΟΣ Φ17 </option>
<option value="ΑΡΜΠΑΡΟΡΙΖΑ Φ17"> ΑΡΜΠΑΡΟΡΙΖΑ Φ17 </option>
<option value="ΑΡΤΕΜΙΣΙΑ Φ17"> ΑΡΤΕΜΙΣΙΑ Φ17 </option>
<option value="ΑΠΗΓΑΝΟΣ Φ17"> ΑΠΗΓΑΝΟΣ Φ17 </option>
<option value="ΒΑΣΙΛΙΚΟΣ Φ17"> ΒΑΣΙΛΙΚΟΣ Φ17 </option>
<option value="ΔΥΟΣΜΟΣ Φ17"> ΔΥΟΣΜΟΣ Φ17 </option>
<option value="ΔΕΝΤΡΟΛΙΒΑΝΟ Φ17"> ΔΕΝΤΡΟΛΙΒΑΝΟ Φ17 </option>
<option value="ΔΕΝΤΡΟΛΙΒΑΝΟ ΕΡΠΟΝ Φ17"> ΔΕΝΤΡΟΛΙΒΑΝΟ ΕΡΠΟΝ Φ17 </option><option value="ΔΕΝΤΡΟΛΙΒΑΝΟ ΗΜΙΕΡΠΟΝ Φ17"> ΔΕΝΤΡΟΛΙΒΑΝΟ ΗΜΙΕΡΠΟΝ Φ17 </option></select>
<a href="#" class="remove_field"> Αφαίρεση Προιόντος</a><div class="posotita">Ποσοτητα <input type="text" name="text[]" size="1" class="form-control">'); //add input box
});
$(document).on("click",".remove_field",function(){
$(this).parent().remove();
});
And last the php :
<?php
$name = $_POST['name'];
$email = $_POST['email'];
$nomos = $_POST['nomos'];
$perioxh = $_POST['perioxh'];
$address = $_POST['address'];
$tel = $_POST['tel'];
$doy = $_POST['doy'];
$dropdown = $_POST['dropdown'];
$posotita = $_POST['text[]'];
$formcontent=" Όνομα: $name
Email: $email
Νομός: $nomos
Περιοχή: $perioxh
Διέυθυνση: $address
Τηλέφωνο: $tel
Δ.Ο.Υ: $doy
Προίοντα: $dropdown
Ποσότητα: $posotita";
$recipient = "info@birdycreative.gr";
$subject = "Contact Form";
$mailheader = "From: $email
";
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
echo "Thank You!" . " -" . "<a href='form.html' style='text-decoration:none;color:#ff0099;'> Return Home</a>";
?>
You can see it online at http://birdycreative.gr/jqueryform.html
Thanks in advance
