Я пытаюсь реализовать счетчик отправки формы на php, если данные с формы отправляются на сервер, в файл counter.txt записывается +1, потом эти данные используются для формирования заголовка в письме как № заявки. Все работает, но на почту приходит 12 одинаковых писем, при следующей отправке 32 и тд. В чем проблема? Почему это происходит?
<?php
$email = trim(strip_tags($_POST['f']['sel']));
$change = trim(strip_tags($_POST['f']['button-set']));
$name = trim(strip_tags($_POST['f']['name']));
$question = trim(strip_tags($_POST['f']['message']));
$submit = trim(strip_tags($_POST['f']['submit']));
if(isset($submit)){
$count = file_get_contents('counter.txt');
$count++;
file_put_contents('counter.txt',$count);
}
else {
$count = file_get_contents('counter.txt');
};
$to = 'support@archsupport.ru';
$subject = 'Заявка №:' . $count . ' с сайта archsupport.ru';
$message = 'Имя: ' . $name . "\r\n" . 'Контакты: ' . $email . "\r\n" . 'Написать ' . $change . "\r\n" . 'Вопрос: ' . $question ;
$headers = 'From: zergg52@gmail.com ' . "\r\n";
$subject = preg_replace("/(\r\n)|(\r)|(\n)/", "", $subject);
$subject = preg_replace("/(\t)/", " ", $subject);
$subject = '=?UTF-8?B?' . base64_encode($subject) . '?=';
@mail($to, $subject, $message, $headers);
echo 'сообщение отправлено!';
?>
Код страницы:
var form = document.getElementsByTagName('form')[0];
var names = document.getElementById('name');
var validn = document.getElementById('vn');
var iconrequired = document.querySelector('#namereq');
var email = document.getElementById('sellection');
var valids = document.getElementById('vs');
var iconrequireds = document.querySelector('#sellectionreq');
var text = document.getElementById('qestions');
var validt = document.getElementById('vt');
var iconrequiredt = document.querySelector('#textreq');
document.addEventListener('input', function validation() {
var x = document.forms["support"]["sellection"].value;
if (names.validity.valid) {
validn.className = "valid";
iconrequired.className = "iconrequired hide";
};
if (email.validity.valid && x != "") {
valids.className = "valid";
iconrequireds.className = "iconrequired hide";
};
if (text.validity.valid) {
validt.className = "valid";
iconrequiredt.className = "iconrequired hide";
};
if (!names.validity.valid) {
validn.className = "invalid";
iconrequired.className = "iconrequired hide";
};
if (!email.validity.valid) {
valids.className = "invalid";
iconrequireds.className = "iconrequired hide";
};
if (!text.validity.valid){
validt.className = "invalid";
iconrequiredt.className = "iconrequired hide";
};
if (names.validity.valid && email.validity.valid && text.validity.valid){
$('#support').submit(function(){
$.post(
'https://www.archsupport.ru/post-email.php', // адрес обработчика
$("#support").serialize(), // отправляемые данные
function(msg) { // получен ответ сервера
$('#support').hide('slow');
$('#my_message_email').html(msg);
}
);
});
} else {
return false;
}
});
function validateSellection(){
var x=document.forms["support"]["sellection"].value;
if (x === "") {
document.getElementById('sellectionreq').classList.remove("hide");
return false;
} else {
document.getElementById('sellectionreq').classList.add("hide");
return false;
}
};
function validateName(){
var x=document.forms["support"]["name"].value;
if (x === "") {
document.getElementById('namereq').classList.remove("hide");
return false;
} else {
document.getElementById('namereq').classList.add("hide");
return false;
}
};
function validateText(){
var x=document.forms["support"]["qestions"].value;
if (x === "") {
document.getElementById('textreq').classList.remove("hide");
return false;
} else {
document.getElementById('textreq').classList.add("hide");
return false;
}
};
$('#support').submit(function validate(){
if(validateName() && validateSellection() && validateText()===true){
return ;
} else {
validateSellection();
validateName();
validateText()
return false
}
});
$(".radio").on('click.two', function() {
let input = $("#sellection");
if ($("#radio").prop("checked")) {
input.prop("disabled", false);
input.prop({
"type": "email",
"placeholder": "example@yourmail.ru",
"autocomplete": "email",
"maxlength": "35",
"minlength": "12",
"value": "",
});
document.getElementById("sellection").pattern = "^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$";
} else {
input.prop("disabled", false);
$("#sellection").prop({
"type": "tel",
"placeholder": "+7-910-205-46-15",
"autocomplete": "tel",
"maxlength": "16",
"minlength": "11",
"value": "",
});
document.getElementById("sellection").pattern = "\\+7\\s?[\\(]{0,1}9[0-9]{2}[\\)]{0,1}\\s?\\d{3}[-]{0,1}\\d{2}[-]{0,1}\\d{2}";
}
input.focus();
input.val("");
});
var iconsel = $('.icons');
iconsel.on('click.ten', function iconback() {
iconsel.removeClass('checked');
$(this).addClass('checked');
});
@font-face {
font-family: "HelveticaNeueCyr-Thin";
src: url("/fonts/HelveticaNeueCyr-Thin.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@keyframes req { 0% { transform:translatex(0px) ; } 100% { transform:translatex(5px) ; } }
@keyframes inv { 0% { opacity:.5 ; } 100% { opacity:1 ; } }
* {
padding:0;
margin:0;
}
:root {
font-family: "HelveticaNeueCyr-Thin";
font-weight:100;
}
form {
font-size: 24px;
position: relative;
width:100%;
display: inline-flex;
flex-direction: column;
}
textarea {
height: 30vh;
border-radius: 18px;
padding-left: 15px;
padding-top:10px;
border: 2px solid #d7d7d7;
overflow: hidden;
overflow-y: scroll;
outline: none;
resize: none
}
input,
textarea {
font-family: "HelveticaNeueCyr-Thin";
font-weight: 100;
font-size: 18px;
}
::-webkit-input-placeholder {
color: gray;
font-size: 18px;
}
::-moz-placeholder {
color: gray;
font-size: 18px;
}
/* Firefox 19+ */
:-moz-placeholder {
color: gray;
font-size: 18px;
}
/* Firefox 18- */
:-ms-input-placeholder {
color: gray;
font-size: 18px;
}
input:not([type="submit"]) {
border-radius:100px;
padding-left:15px;
height:36px;
border:none;
background: #f3f3f3;
}
input:focus {
outline:none;
border:2px solid #f3f3f3;
box-sizing:border-box;
background:white;
padding-left:13px;
}
.required {
display:inline-flex;
width:100%;
flex-direction: column;
margin-bottom: 15px;
position:relative;
}
.iconrequired{
margin:auto;
display:flex;
align-items: center;
justify-content: center;
width:90px;
height:14px;
color: white;
border-radius:100px;
font-size:10px;
font-weight:100;
font-family: "HelveticaNeueCyr-Thin";
background:#343434;
position:absolute;
right:15px;
top: 10px;
opacity:1;
transition: opacity ease-out 1s;
animation: .05s ease-in-out 0s 4 alternate req;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
transition: background-color 5000s ease-in-out 0s;
border:2px solid #f3f3f3;
box-sizing:border-box;
padding-left:13px;
}
div.button-set {
display: inline-flex;
}
div.button-set>label {
position: relative;
flex: 0 0 auto;
height: 50px;
width: 50px;
margin-left: 15px;
border-radius: 100px;
outline: none;
border: none;
margin-bottom: 20px;
}
.checked {
background: #f3f3f3;
border-radius: 100px;
}
input[type="submit"] {
font-family: "HelveticaNeueCyr-Thin";
height: 36px;
width: 160px;
font-weight: 100;
font-size: 24px;
margin-top: 20px;
margin-left: 10px;
border: none;
border-radius: 100px;
background: #f3f3f3;
padding:0;
}
::-webkit-scrollbar {
position: absolute;
z-index: 9999;
width: 5px;
}
::-webkit-scrollbar-button {
display: none;
}
::-webkit-scrollbar-track {
z-index: 9999;
background-color: transparent;
}
::-webkit-scrollbar-track-piece {
z-index: 9999;
z-index: 9999;
background-color: transparent;
}
::-webkit-scrollbar-thumb {
z-index: 9999;
background-color: #d7d7d7;
border-radius: 3px;
}
::-webkit-scrollbar-corner {
z-index: 9999;
background-color: #d7d7d7;
}
.invalid {
width:12px;
height:12px;
color: white;
position:absolute;
right:15px;
top: 12px;
background:tomato;
border-radius:6px;
animation: 2s ease-in-out 0s infinite alternate inv;
}
.valid {
width:12px;
height:12px;
color: white;
position:absolute;
right:15px;
top: 12px;
background:#9dc46b;
border-radius:6px;
animation: 2s ease-in-out 0s infinite alternate inv;
}
.error {
text-align:right;
font-size:12px;
padding-right:20px;
padding-top:10px;
color:gray;
letter-spacing:.05em;
}
.hide {
display:none;
}
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="/css/form.css">
</head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body>
<form novalidate action="" method="post" name="support" id="support" >
<label class="required"><span id="vs" class="invalid hide"></span><input id="sellection" class="mail sellection" name="f[sel]" vlaue="" placeholder="выбери удобный способ связи ниже...." required disabled><span id="error1"></span><div id="sellectionreq" class="iconrequired hide">ОБЯЗАТЕЛЬНОЕ</div></label>
<div class="button-set">
<label title="Почта"><img class="icons" src='/img/icon/social_icon_mail_white.svg'><input class="radio" id="radio" type="radio" name="f[button-set]" value="на почту" style="display:none;"></label>
<label for="radio1" title="WhatsApp"><img class="icons" src='/img/icon/social_icon_whatsapp_white.svg'><input class="radio" id="radio1" type="radio" name="f[button-set]" value="в WhatsApp" style="display:none;"></label>
<label for="radio2" title="Telegram"><img class="icons" src='/img/icon/social_icon_telegram_white.svg'><input class="radio" id="radio2" type="radio" name="f[button-set]" value="в Telegram" style="display:none;"></label>
<label for="radio3" title="Viber"><img class="icons" src='/img/icon/social_icon_viber_white.svg'><input class="radio" id="radio3" type="radio" name="f[button-set]" value="в Viber" style="display:none;"></label>
</div>
<label class="required"><span id="vn" class="invalid hide"></span>
<input id="name" class="mail" type="name" name="f[name]" autocomplete= none placeholder="как к тебе обращаться...." value="" pattern="[А-Яа-яЁё]+(\s+[А-Яа-яЁё]+)?" maxlength="15" minlength="2" required><div id="namereq" class="iconrequired hide">ОБЯЗАТЕЛЬНОЕ</div></label>
<label class="required"><span id="vt" class="invalid hide"></span><textarea id="qestions" type="text" placeholder="введи текст своего вопроса...." name="f[message]" value="" pattern="[А-Яа-яЁё]+(\s+[А-Яа-яЁё]+)?" maxlength="4000" minlength="45" required></textarea><div id="textreq" class="iconrequired hide">ОБЯЗАТЕЛЬНОЕ</div></label>
<input name="f[submit]" type="submit" id="submit" value="ОТПРАВИТЬ" />
</form>
<div id="my_message_email"></div>
</body>
</html>
isset($submit)
false
, то зачем слать письмо?