Как мне создать выпадающий список, который повторяет запись MySQL? PHP, SQL
Я создаю веб-сайт и мне нужна помощь в создании чего-то похожего на это:
https://matchstat.com/tennis/head-to-head
(пользователь может выбрать любых 2 игроков и сравнить их выигрыши).
Однако вместо того, чтобы вводить в поле поиска, я буду использовать раскрывающийся список, какие-либо идеи о том, как этого можно достичь?
Пока что я настроил свою базу данных и подключился с использованием SQL, PHP.
Быстрая иллюстрация моей формы:
[выберите игрока] // это будет выпадающее менюИмя: // содержимое этих полей будет зависеть от того, какого игрока выбрал пользователь из раскрывающегося списка / опций выше
Фамилия:
Национальность:
DOB:
Рост:
Вес:
Любой совет будет принят во внимание.
Большое спасибо
Решение
Если у вас есть результаты SQL-запроса, сохраненные в 2-мерном массиве (строки х столбцы), вы можете просто просмотреть результаты массива, чтобы распечатать <option>s для раскрывающегося списка <select> коробка вроде так:
<?php
$users = // SQL query result
echo "<select>";
foreach($users as $user) {
$data = $user["forename"];
echo "<option value='$data'>$data</option>";
}
echo "</select>";
?>
По запросу, здесь есть более сложное решение, которое создает раскрывающийся список а также позволяет отображать данные. Здесь также используется jQuery (можно использовать обычный JS, но jQuery значительно упрощает):
<select id="dropdown">
<?php
// this PHP is essentially the same as in the above example
$users = [ // this is the test array I used. The SQL result should be in the same format for this to work.
[
"forename"=>"a_name",
"dob"=>"never",
"height"=>"too_tall",
"weight"=>"too_heavy",
"nationality"=>"martian"],
[
"forename"=>"second_name",
"dob"=>"always",
"height"=>"too_short",
"weight"=>"too_light",
"nationality"=>"moon"],
[
"forename"=>"third_name",
"dob"=>"forever",
"height"=>"300ft",
"weight"=>"2000lb",
"nationality"=>"Earth"]
];
$userDataArray = []; // multidimensional array
$user_id = 0;
foreach($users as $user) {
$data = $user["forename"];
echo "<option value='$user_id'>$data</option>";
$user_id++;
$userDataArray[] = [ "forename"=>$user["forename"], "dob"=>$user["dob"], "height"=>$user["height"], "weight"=>$user["weight"], "nationality"=>$user["nationality"] ];
// index 0 = forename, 1 = DOB, 2 = height, 3 = weight, 4 = nationality
}
?>
</select><br />
<span id="display"></span>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script><!-- load jQuery library -->
<script>
var users = [
<?php // translate PHP array to JS one
foreach($userDataArray as $user) {
echo "{ forename: '" . $user["forename"] . "', dob: '" . $user["dob"] . "', weight: '" . $user["weight"] . "', height: '" . $user["height"] . "', nationality: '" . $user["nationality"] . "'},";
}
?>
];
$("#dropdown").change(function() {
var i = $("#dropdown").val();
$("#display").html("Name: " + users[i].forename + "<br />DOB: " + users[i].dob + "<br />Weight: " + users[i].weight + "<br />Height: " + users[i].height + "<br />Nationality: " + users[i].nationality);
});
</script>
Извините, этот ответ такой длинный и запутанный. Я не уверен, есть ли какой-нибудь более простой способ, особенно когда речь идет о двух разных языках (и да, вам нужно иметь дело как с сервером (база данных с PHP), так и с клиентом (выпадающий с JS). Надеюсь, это поможет!
Увидеть теперь правильный вывод здесь в идеоне.
Другие решения
Других решений пока нет …