Доброго времени суток!
Подскажите пожалуйста как отправить то что в javascript методом post в php?
Дело в том что появляются несколько input type="text" и также у них одинаковый name="order"
Если выбрать несколько то отправляется на почту только одно значение name="order"
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.price li{
text-align: center;
display: inline-block;
vertical-align: top;
margin: 20px;
}
.price a{
color: #fff;
background: rgba(226, 30, 36, 0.2);
font-size: 14px;
text-decoration:none;
padding: 1px 5px;
border-radius: 5px;
}
.overlay {
background-color: rgba(0, 0, 0, 0.7);
bottom: 0;
cursor: default;
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
visibility: hidden;
z-index: 99999;
-webkit-transition: opacity .5s;
-moz-transition: opacity .5s;
-ms-transition: opacity .5s;
-o-transition: opacity .5s;
transition: opacity .5s;
}
.overlay:target {
visibility: visible;
opacity: 1;
}
.popup img{
display: inline;
border: none;
padding: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #ffffff;
}
.popup {
background-color: #fff;
border: 3px solid #fff;
display: inline-block;
left: 50%;
opacity: 0;
padding: 15px;
position: fixed;
text-align: justify;
font: 14px Helvetica, Arial, Sans-Serif;
top: 40%;
visibility: hidden;
z-index: 999999;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;
-webkit-transition: opacity .5s, top .5s;
-moz-transition: opacity .5s, top .5s;
-ms-transition: opacity .5s, top .5s;
-o-transition: opacity .5s, top .5s;
transition: opacity .5s, top .5s;
}
.overlay:target+.popup {
top: 50%;
opacity: 1;
visibility: visible;
}
.test{
color: #fff;
background: rgba(226, 30, 36, 0.2);
font-size: 14px;
text-decoration:none;
padding: 1px 5px;
border-radius: 5px;
}
</style>
</head>
<body>
<div class="tab_item">
<ul class="price one">
<li data-text="фигня всякая">Визитки Однастороние<br /><a href="#order">Заказать</a></li> <!-- сделали data-text в остальные li сам -->
<li data-text="ещё фигня">Личтовки Однастороние<br /><a href="#order">Заказать</a></li>
<li>Плакаты Однастороние<br /><a href="#order">Заказать</a></li>
<li>Блокноты Однастороние<br /><a href="#order">Заказать</a></li>
</ul>
<ul class="price one">
<li>Визитки двухстороние<br /><a href="#order">Заказать</a></li>
<li>Личтовки двухстороние<br /><a href="#order">Заказать</a></li>
<li>Плакаты двухстороние<br /><a href="#order">Заказать</a></li>
<li>Блокноты двухстороние<br /><a href="#order">Заказать</a></li>
</ul>
</div>
<!-- Заказать окно -->
<a href="#x" class="overlay" id="order"></a>
<div class="popup fform">
<form action="feedback.php" method="post">
<input type="text" class="b4" name="name" placeholder="Введите ваше имя" /><br />
<input id="phone5" type="text" tabindex="2" class="b4" name="phone" placeholder="+7 Номер телефона" /><br />
<input type="text" id="idn" class="b4" name="zakaz" placeholder="Комментарий" /><br />
<input type="button" value="Отправить" name="tut"> <!-- дали имя чтобы перед ним ставить -->
</form>
</div>
<script>
[].forEach.call(document.querySelectorAll('.price li'), function(item) {
item.addEventListener('click', function() {
var form = document.querySelector('form');
var name = form.tut ; //смотреть сюда
var input = document.createElement('input');
var a = item.dataset.text;//смотреть сюда
input.value = a;
input.type = 'text';
input.name = 'order';
input.className = 'in5';
form.insertBefore(input,name);
var br = document.createElement('br');
var del = document.createElement('input');
del.value = 'X';
del.type = 'button';
del.className = 'test';
del.addEventListener('click', function() {
form.removeChild(input);
form.removeChild(del);
form.removeChild(br);
})
form.insertBefore(del,name);
form.insertBefore(br,name);
});
});
</script>
</body>
</html>
|