есть код index.php
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Пример работы AJAX</title>
</head>
<body>
<script>
function loadtable1() {
// if ($('#date_from').val() == '') {
// $('#date_from').css('background', 'red');
// return;
// }
// if ($('#date_to').val() == '') {
// $('#date_to').css('background', 'red');
// return;
// }
//после загрузки DOM-дерева страницы
document.addEventListener("DOMContentLoaded",function() {
//получить кнопку
let mybutton = document.getElementById('send');
//подписаться на событие click по кнопке и назначить обработчик, который будет выполнять действия, указанные в безымянной функции
mybutton.addEventListener("click", function(){
//1. Сбор данных, необходимых для выполнения запроса на сервере
let name = document.getElementById('name').value;
//Подготовка данных для отправки на сервер
//т.е. кодирование с помощью метода encodeURIComponent
name = 'nameUser=' + encodeURIComponent(name);
// 2. Создание переменной request
let request = new XMLHttpRequest();
// 3. Настройка запроса
request.open('POST','xz.php',true);
// 4. Подписка на событие onreadystatechange и обработка его с помощью анонимной функции
request.addEventListener('readystatechange', function() {
//если запрос пришёл и статус запроса 200 (OK)
if ((request.readyState==4) && (request.status==200)) {
// например, выведем объект XHR в консоль браузера
console.log(request);
// и ответ (текст), пришедший с сервера в окне alert
console.log(request.responseText);
// получить элемент c id = welcome
let welcome = document.getElementById('welcome');
// заменить содержимое элемента ответом, пришедшим с сервера
welcome.innerHTML = request.responseText;
}
});
// Устанавливаем заголовок Content-Type(обязательно для метода POST). Он предназначен для указания кодировки, с помощью которой зашифрован запрос. Это необходимо для того, чтобы сервер знал как его раскодировать.
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
// 5. Отправка запроса на сервер. В качестве параметра указываем данные, которые необходимо передать (необходимо для POST)
request.send(name);
});
});
}
</script>
<div class="monitoring menu">
<div class="calls module">
<table class="table table-head table-striped ">
<tr>
<th colspan=2><label for="date_from">От: </label><input type="date" id="date_from" value=""></th>
<th colspan=2><label for="date_to">До: </label><input type="date" id="date_to" value=""></th>
<th><button class="btn btn-primary" id="send" onclick="loadtable1();">Отчет</button></th>
</table>
<div id="welcome">ad</div>
</body>
</html>
серверная часть xz.php
<?php
// создадим переменную для формирования ответа
$output ='';
// если в массиве пост есть ключ nameUser, то
if (isset($_POST['nameUser'])) {
// в переменную name помещаем переданное с помощью запроса имя
$name = $_POST['nameUser'];
// добавляем в переменную output строку приветствия с именем
$output .= 'Здравствуйте, '.$name.'! ';
// добавляем в переменную output IP-адрес пользователя
if ($_SERVER['REMOTE_ADDR']) {
$output .= 'Ваш IP адрес: '. $_SERVER['REMOTE_ADDR'];
}
else {
$output .= 'Ваш IP адрес неизвестен.';
}
// выводим ответ
echo $output;
}
При нажатии кнопки в блоке должен вывести текст с ip адресом, но при нажатии кнопуи ничего не происходит и ошибки не возникает