javascript HTML 选择 onchange 更新查询
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10231264/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML select onchange update query
提问by Josh Pullin
I have a form with two select dropdowns. One with countries and one with universities. The country dropdown is populated from a MySQL database showing all countries inputted. At first I want the university dropdown to be populated with all the universities in the system however the end user wants the system to be dynamic and learn as it goes on so at this moment in time the dropdown doesn't show any data.
我有一个带有两个选择下拉列表的表单。一个是国家，一个是大学。国家下拉列表由 MySQL 数据库填充，显示所有输入的国家。起初，我希望大学下拉列表中包含系统中的所有大学，但是最终用户希望系统是动态的并随着它的进行而学习，因此此时下拉列表不显示任何数据。
<select name="academicdropdown" onchange="countrysortlist()" style="width:178px">
<option value"">Sort By Country</option>
<option value"All" style="font-weight:bold; font-style:italic">All Countries</option>
<?php
while ($row=mysqli_fetch_array($countryresult2)) {
$id = $row["country_id"];
$country = $row["country"];
echo "<option value='$id'>$country</option>\n";
}
?>
</select>
<select name="universitydropdown" onclick="unilist()" style="width:154px">
<option value"">University</option>
<?php
if(isset($_SESSION['appformuniversity'])) {
if($_SESSION['appformacademic'] == "universitylist") {
$universityinput = $_SESSION['appformuniversitylist'];
while ($row=mysqli_fetch_array($universityresult)) {
$universityid = $row["university_id"];
$university = $row["university_name"];
if($universityid == $universityinput) {
echo "<option value='$universityid' selected='selected'>$university</option>\n";
}
else {
echo "<option value='$universityid'>$university</option>\n";
}
}
}
else {
while ($row=mysqli_fetch_array($universityresult)) {
$universityid = $row["university_id"];
$university = $row["university_name"];
echo "<option value='$universityid'>$university</option>\n";
}
}
}
else {
while ($row=mysqli_fetch_array($universityresult)) {
$universityid = $row["university_id"];
$university = $row["university_name"];
echo "<option value='$universityid'>$university</option>\n";
}
}
?>
</select></td></tr>
What I would like to do is when the user selects one of the countries in the country dropdown, it will update the universities dropdown with universities that are within that country. I know you have to use the onchange event but I do not know how to do the scripting side? Any help would be appreciated.
我想要做的是，当用户选择国家下拉列表中的一个国家时，它将使用该国家/地区内的大学更新大学下拉列表。我知道你必须使用 onchange 事件但我不知道如何做脚本方面？任何帮助，将不胜感激。
My university query at the moment is
我目前的大学查询是
$universitysql = "SELECT * FROM university ORDER BY university_name ASC" ;
Thanks in advance for any help. Much appreciated.
在此先感谢您的帮助。非常感激。
采纳答案by Tuhin Subhra Dey
You have to use ajax for this. If you know Jquery it would be easier. Just include the
jquery.js file . Then write the ajax in the onchange function of the country dropdown.
In the onchange method just pass the id of the country. Then in your ajax method send
id to a php page. In that page generate the whole option list from the sql query using
that country id . Make a relation between two tables i.e every university row should
contain country id. Then echo the option list. In your ajax method just change the
university list dynamically using innerhtml. I am giving you example
1. onchange on country select
onchange="countrysortlist(this.value)"
2. ajax method in countrysortlist function
$.ajax({
type: 'POST',
url: 'yourpage.php', // change name
data: "countryid="+id, // country id
success: function(data) { // returns date
$('.result').html(data); // result should be the class name of university dropdown
}
});
回答by Luigi Siri
You can do something like this with javascript:
你可以用 javascript 做这样的事情：
<script type="text/javascript">
function countrysortlist()
{
document.form_name.submit();
}
</script>
When you change the select option, the site will update submitting the form
当您更改选择选项时，站点将更新提交表单
<form name='form_name' action='' method='get'>
<select name="academicdropdown" onchange="countrysortlist()" style="width:178px">
...
</select>
</form>
Then the query will load just the universities within the country id submitted.
然后查询将仅加载提交的国家/地区 ID 内的大学。
<?php
$country_id = $_GET['academicdropdown'];
$universitysql = "SELECT * FROM university where countryid = '$country_id' ORDER BY university_name ASC" ;
?>
