Код:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
// Функция, которая запускается при выборе клиента из списка
function selectClient() {
// Получаем значение выбранного клиента
var client = $("#client-select").val();
// Если клиент не выбран, то ничего не делаем
if (client == "") return;
// Отправляем AJAX-запрос на сервер, передавая имя клиента
$.ajax({
url: "228.php",
type: "GET",
data: {client: client},
dataType: "json",
success: function(data) {
// Если запрос успешен, то выводим полученные данные на экран
$("#client-data").html(
"<p>Имя: " + data['name'] + "</p>"
// "<p>Телефон: " + data.phone + "</p>" +
// "<p>Адрес: " + data.address + "</p>"
);
},
error: function(xhr, status, error) {
// Если запрос не удался, то выводим сообщение об ошибке
$("#client-data").html("<p>Произошла ошибка: " + error + "</p>");
}
});
}
</script>
</head>
<body>
<h1>Фоновый поиск данных клиента</h1>
<!-- Выпадающий список с именами клиентов -->
<select id="client-select" onchange="selectClient()">
<option value="">Выберите клиента</option>
<?php
// Подключаемся к базе данных
$conn = new mysqli("localhost", "root", "", "client");
// Если подключение не удалось, то выводим сообщение об ошибке
if ($conn->connect_error) {
die("Ошибка подключения: " . $conn->connect_error);
}
// Выполняем запрос к базе данных, получая имена клиентов
$sql = "SELECT name FROM client";
$result = $conn->query($sql);
// Если запрос успешен, то выводим имена клиентов в виде опций списка
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
echo "<option value='" . $row["name"] . "'>" . $row["name"] . "</option>";
}
}
// Закрываем подключение к базе данных
$conn->close();
?>
</select>
<!-- Блок, в котором будут отображаться данные выбранного клиента -->
<div id="client-data"></div>
</body>
</html>