我用javascript得到了多个数据库下拉列表,我想在下拉菜单中显示结果。但此时此刻,什么也看不出来。它显示地区(下拉菜单),但不显示国家(下拉菜单)
我的核心代码(我想在国家下拉菜单中显示结果):
<html>
<body>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
function abc(){
var e = document.getElementById("Region_ID");
var val = e.options[e.selectedIndex].value;
$.post("getSecondDropDown.php",{ Region_ID:val}, function( data ) {
$("#Country_ID").html(data);
});
}
</script>
<form action="/NewService.php" id="ServiceForm" method="post">
Name:<input type="text" name="Service_Name"></br>
Region: <select name="Region_ID" id="Region_ID" onchange="abc()" form="ServiceForm">
<?php
include('config.php');
try {
$conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $conn->prepare("SELECT Region_ID, Region_Name FROM Regions");
$stmt->execute();
$result = $stmt->setFetchMode(PDO::FETCH_ASSOC);
foreach($stmt as $v) {
echo "<option value='" . $v['Region_ID'] ."'>" . $v['Region_Name'] ."</option>";
}
}
catch(PDOException $e) {
echo "Error: " . $e->getMessage();
}
$conn = null;
?>
</select></br>
Country: <select name="Country_ID" form="ServiceForm">
<script>document.write($("#Country_ID"))</script>
</select></br>
<input type="submit">
</form>
</body>
</html>
第二个php文件(getSecondDropDownMenu.php):
<?php
$Region_ID =$_POST['Region_ID'];
$option="";
try {
$conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $conn->prepare("SELECT Country_ID, Country_Name FROM Countries WHERE Region_ID ='$Region_ID'");
$stmt->execute();
$result = $stmt->setFetchMode(PDO::FETCH_ASSOC);
foreach($stmt as $v) {
echo "<option value='" . $v['Country_ID'] ."'>" . $v['Country_Name'] ."</option>";
}
echo $option;
?>
我想问题就在这里,但我不太清楚:
Country: <select name="Country_ID" form="ServiceForm">
<script>document.write($("#Country_ID"))</script>
</select></br>
在第二个文件(getSecondDropDownMenu)中,你需要创建一个函数
<?php
function functionName(){
$Region_ID =$_POST['Region_ID'];
$option[] = null;
try {
$conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $conn->prepare("SELECT Country_ID, Country_Name FROM Countries WHERE Region_ID ='$Region_ID'");
$stmt->execute();
$result = $stmt->setFetchMode(PDO::FETCH_ASSOC);
foreach($stmt as $v) {
array_push($option, "<option value='" . $v['Country_ID'] ."'>" . $v['Country_Name'] ."</option>");
}
return option;
}
?>
然后在另一个文件中包含它包括(getSecondDropDownMenu.php);
和do
$arrayForSecondDropdown[] = functionName();
,然后像
一样执行foreach foreach($arrayForSecondDropdown as $v){
echo $v;
}
您可以通过使用onchange='abc(this.value)'
调用abc
函数来简化它,并且目标下拉列表需要一个ID属性来启用回调以添加html数据。此外,由于您没有向sql语句传递任何变量,因此您并不真正需要准备好的语句,因此简单的query
应该足够了。
<html>
<head>
<title>dependant select menu</title>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
function abc( value ){
$.post("getSecondDropDown.php",{ Region_ID:value }, function( data ) {
$("#Country_ID").html( data );
}
);
}
</script>
</head>
<body>
<form action="/NewService.php" id="ServiceForm" method="post">
Name:<input type="text" name="Service_Name"></br>
Region: <select name="Region_ID" id="Region_ID" onchange="abc( this.value )" form="ServiceForm">
<?php
include('config.php');
try {
$conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
$conn->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
$stmt = $conn->prepare( "SELECT Region_ID, Region_Name FROM Regions" );
$stmt->execute();
$result = $stmt->setFetchMode( PDO::FETCH_ASSOC );
foreach($stmt as $v) {
echo "<option value='" . $v['Region_ID'] ."'>" . $v['Region_Name'] ."</option>";
}
} catch(PDOException $e) {
echo "Error: " . $e->getMessage();
}
$conn = null;
?>
</select>
</br>
Country: <select id='Country_ID' name="Country_ID" form="ServiceForm"></select>
</br>
<input type="submit">
</form>
</body>
</html>
我认为你错过了配置文件,包括在你的第二个php文件(getSecondDropDownMenu.php):所以这个脚本不能运行。为什么发生这种情况意味着这个页面能够获得数据库连接 .你正在根据地区从数据库中获取国家列表,所以这里没有实现数据库连接。所以请包含config.php,然后再试一次。此外,您还在连接php变量与字符串 . ie中的国家获取查询中犯了另一个错误,您应该使用正确的语法连接区域变量。请参阅下面的代码。
第二个php文件(getSecondDropDownMenu.php):
<?php
include('config.php');
$Region_ID =$_POST['Region_ID'];
$option="";
try {
$conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $conn->prepare("SELECT Country_ID, Country_Name FROM Countries WHERE Region_ID ='".$Region_ID."'");
$stmt->execute();
$result = $stmt->setFetchMode(PDO::FETCH_ASSOC);
foreach($stmt as $v) {
echo "<option value='" . $v['Country_ID'] ."'>" . $v['Country_Name'] ."</option>";
}
echo $option;
?>
我想这可能对你有帮助。
您已经编写了代码以在选择标签的ID的帮助下显示,但是您还没有为select tag
提供任何ID
<script>document.write($("#Country_ID"))</script>
根据您提供的脚本,您必须为select标记添加ID Attribute
。
我建议不要使用document.write
,特别是在页面加载之后。它会导致意想不到的结果。请使用以下方法:
尝试替换为:
document.getElementById('Country_ID').innerHTML = "something important";
然而,如果你不愿意替换整个innerHTML,你可以添加一些东西:
document.getElementById('Country_ID').insertAdjacentHTML('beforeend', "something added");