0
我試圖從基於從選擇框中選擇的選項使用PHP和AJAX從XML拉數據。使用PHP和基於選擇選項的AJAX輸出XML信息
我在選擇變更時沒有得到任何輸出。
HTML
<?php
session_start();
// Change the connection info in this file
require 'dbInfo.php';
?>
<!DOCTYPE html>
<html>
<head>
<title>Member Page</title>
<script type="text/javascript">
// AJAX to show info for the selected City
function ShowCityInfo(citySelection)
{
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if (this.readyState == 4 && this.status == 200){
document.getElementById('cityInfo').innerHTML = this.responseText;
}
};
xmlhttp.open("GET", "getCityData.php?city=" + citySelection, true);
xmlhttp.send();
}
// AJAX to show info for the selected Rider
function ShowRiderInfo(rider)
{
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if (this.readyState == 4 && this.status == 200){
document.getElementById('riderInfo').innerHTML = this.responseText;
}
};
xmlhttp.open("GET", "getRiderInfo.php?rider=" + rider, true);
xmlhttp.send();
}
</script>
</head>
<body>
<h1>Welcome User!</h1>
<?php
// If there is not a valid user logged in, kick back to login page
if (!isset($_SESSION['user']) || empty($_SESSION['user'])) {
header("Location:login.php");
exit();
}
else { // Welcome the valid user
echo "<h1>" . $_SESSION['user'] . "'s Member Page </h1>";
}
// Clear the session if the user is logged out based on query string
if (isset($_GET['loggedOut'])) {
session_unset();
session_destroy();
// Redirect to login and exit the script execution
header("Location:login.php");
exit();
}
?><br/>
<!-- On submission use query string to set that the user is logged out.
Would be reverted by isset above on reload -->
<form action="member.php?loggedOut=true" method="POST">
<input type="submit" name="logOut" value="Log Out"><br/>
</form>
<?php
$conn = new mysqli($host, $username, $password, $db);
// Check for connection error
if ($conn->connect_error) {
die("Connection error: " . $conn->connect_error);
}
?>
<br/><br/>
<strong>Select a City for more Information</strong> <br/>
<!-- Populate selection from DB -->
<select name="cities" onchange="ShowCityInfo(this.value)">
<option>Select a City</option>
<?php
$sql = "SELECT * FROM webData.nwoCity";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
// Populate the select options from DB city names and set value to the ID
echo '<option value=" '. $row["cityID"] . '">'. $row["name"] . '</option>';
}
}
$conn->close();
?>
</select>
<!-- Will be populated by AJAX -->
<div id="cityInfo"></div>
<h2>Artistic Freedom</h2>
<p>This populates from XML using AJAX</p>
<select name="riders" onchange="ShowRiderInfo(this.value)">
<option><strong>Select a Rider:</strong></option>
<option value="Ryan Dungey">Ryan Dungey</option>
<option value="Ken Roczen">Ken Roczen</option>
<option value="Eli Tomac">Eli Tomac</option>
<option value="Dean Wilson">Dean Wilson</option>
</select>
<br/><br/>
<div id="riderInfo"></div>
</body>
</html>
PHP
<?php
$riderSelection = $_GET["rider"];
// Create a DOM Document and load the XML file
$xmlDoc = new DOMDocument();
$xmlDoc->load("riderLineup.xml");
// Get the rider elements
$x = $xmlDoc->getElementsByTagName('RIDER');
// Find all the rider elements that match the name
for ($i = 0; $i < $x->length ; $i++)
{
// Only process the nodes in each element
if ($x->item($i)->nodeType == 1)
{
if ($x->item($i)->childNodes->item(0)->nodeValue == $riderSelection)
{
$y = ($x->item($i)->parentNode);
}
}
}
$rider = ($y->childNodes);
// Output the rider information to be used by AJAX as a response
for ($i = 0; $i < $rider->length; $i++)
{
// Only process nodes in elements
if ($rider->item($i)->nodeType == 1)
{
// Element node name in bold
echo "<strong>" . $rider->item($i)->nodeName . "</strong>";
// Element node's value
echo $rider->item($i)->childNodes->item(0)->nodeValue;
echo "<br/>";
}
}
?>
XML
<LINEUP>
<RIDER>
<NAME>Ryan Dungey</NAME>
<AGE>27</AGE>
<NICKNAME>The Diesel</NICKNAME>
<NUMBER>1</NUMBER>
<BRAND>KTM</BRAND>
<CHAMPIONSHIPS>7</CHAMPIONSHIPS>
</RIDER>
<RIDER>
<NAME>Ken Roczen</NAME>
<AGE>22</AGE>
<NICKNAME>Kenny</NICKNAME>
<NUMBER>94</NUMBER>
<BRAND>Honda</BRAND>
<CHAMPIONSHIPS>3</CHAMPIONSHIPS>
</RIDER>
<RIDER>
<NAME>Eli Tomac</NAME>
<AGE>25</AGE>
<NICKNAME>ET3</NICKNAME>
<NUMBER>3</NUMBER>
<BRAND>Kawasaki</BRAND>
<CHAMPIONSHIPS>1</CHAMPIONSHIPS>
</RIDER>
<RIDER>
<NAME>Dean Wilson</NAME>
<AGE>26</AGE>
<NICKNAME>Deano</NICKNAME>
<NUMBER>15</NUMBER>
<BRAND>Husqvarna</BRAND>
<CHAMPIONSHIPS>1</CHAMPIONSHIPS>
</RIDER>
<RIDER>
<NAME>Benny Bloss</NAME>
<AGE>20</AGE>
<NICKNAME>The Baby Giraffe</NICKNAME>
<NUMBER>34</NUMBER>
<BRAND>KTM</BRAND>
<CHAMPIONSHIPS>0</CHAMPIONSHIPS>
</RIDER>
</LINEUP>
當我運行的主網頁我看到了騎士小號選框，但改變選擇不會導致任何輸出。
是的，這段代碼確實是作爲大學課程作業的代碼開始的。然而，這項任務已經提交給教授進行評分，我只是想回頭再去理解這些概念。這個關於從XML獲取信息的代碼不是分配工作的一部分。