js использует url, а не пути файлов как php. У тебя адрес получается
https://site/this/./mail.php
В отправке данных должен быть url
url: "https://site/mail.php"
или
url: "/mail.php"
- это от корня домена, т.е. будет использован
https://site/mail.php
или
url: "mail.php"
- будет использовано текущее расположение.
https://site/this/mail.php
И не забывай, что многие отключают js и для них нужно использовать стандартный post или get. Поэтому action тебе в этом понадобится. В url парсишь action формы и отправляешь туда данные, а если js отключен, то работает обычная форма.
Как буду у компьютера напишу тут простую функцию jQuery для отправки любой формы на сайте.
mail.php
<?PHP
if(!empty($_POST)){
if($_POST['ajax'] == 1){//получили данные от JS, значит нужно вернуть JSON
echo json_encode(array(
'type' => 'success',
'title' =>'Данные получены',
'message' =>'Ваше имя '.$_POST['name'].', а телефон '.$_POST['phone'].';)'));
}else{
echo 'Данные отправили';
echo '<pre>';
var_dump($_POST);
echo '</pre>';
}
}else{
echo 'Данных нет';
}
function.js - одна функция для отправки всех форм ;)
$('form').submit(function() {
var url = $(this).attr('action');
var data = $(this).serialize()+'&ajax=1';
$.post(url, data, function(result){
console.log(result);
swal(result.title, result.message, result.type)
}, 'json');
return false;
});
index.html
<!DOCTYPE html>
<html lang="ru">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link href="style.css" rel="stylesheet" type="text/css">
<title>Форма</title>
</head>
<body>
<form class="message__form" action="mail.php" method="post">
<!-- Hidden Required Fields -->
<input type="hidden" name="project_name" value="Site Name">
<input type="hidden" name="admin_email" value="......@gmail.com">
<input type="hidden" name="form_subject" value="Form Subject">
<!-- END Hidden Required Fields -->
<p>
<label class="visually-hidden" for="name">Ваше имя</label>
<input class="name" id="name" type="text" name="name" value="" placeholder="Ваше имя" required>
</p>
<p>
<label class="visually-hidden" for="phone">Ваше телефон</label>
<input class="phone" id="phone" type="text" name="phone" value="" placeholder="Ваше телефон" required>
</p>
<button class="button-send button" type="submit" name="button">Отправить</button>
</form>
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="functions.js"></script>
</body>
</html>
Ошибка Ваша в том, что Вы не подключили jQuery и поэтому Ваша функция отправки не работала.
При появлении вопросов можете смело писать на моем форуме
PSWeb.ru
Ваша форма в работе
https://lolik777.psweb.ru/