Я работал над этим последние два дня, и это единственная часть задания, которая доставляет мне неприятности. Я думал, что AJAX сделает так, чтобы результаты страницы PHP отображались на исходной странице. (это то, как это работало на предыдущей странице, над которой я работал. Однако для этого нужно было вернуть только один результат, поэтому копирование + вставка этого кода здесь не сработает).
Мне нужны результаты из myName_search Файл. php, который будет отображаться в файле html после нажатия кнопки, но ничего не происходит. Что я делаю неправильно? Поможет ли использование json? Вот скриншот, если он поможет вам понять, что происходит:
Файл HTML находится ниже
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript">
function queryStudent() {
//Retrieve user input, minGPA
var minGPA = document.getElementById('input').value
//Build querystring
var queryString = "?minGPA=" + minGPA;
//Create XMLHttpRequest
var xmlhttp = new XMLHttpRequest();
//Define function to process server feedback
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("output").innerHTML = xmlhttpRequest.responseText;
}
};
//Run query
xmlhttp.open("POST", "myName_search.php" + queryString, true);
xmlhttp.send();
}
</script>
</head>
<body>
<article>
<form name="student" method="post" action="myName_search.php">
<label>Minimum GPA: </label>
<input type="number" step="0.01" min="0" max="4" id="input" name="minGPA" value="">
<br>
<br>
<input type="button" onclick="queryStudent();" value="Search" id="button">
</form>
<p>Students with higher than minimum GPA will be displayed below.</p><br>
<!--output section after search-->
<section id="output">
<h2>Student list (Students with GPAs higher than <?php echo ($minGPA); ?></h2>
</section><br><br>
<a href="search_split.htm">Search & Split</a>
</article>
</body>
</html>
Файл PHP
<?php
require("database.php");
//Retrieve user input
$minGPA = $_REQUEST['minGPA'];
//Evaluate user input
if( $minGPA == "" )
die("Invalid GPA");
//Prepare and execute
$sql = 'SELECT studentID, name, email, GPA FROM student WHERE GPA >= :minGPA ORDER BY studentID';
$query = $pdo->prepare($sql);
$query->bindValue(':minGPA', $minGPA, PDO::PARAM_STR);
$query->execute();
$students = $query->fetchAll(PDO::FETCH_ASSOC);
?>
<table>
<tr>
<th>StudentID</th>
<th>Name</th>
<th>Email</th>
<th>GPA</th>
</tr>
<?php foreach ($students as $student) : ?>
<tr>
<td><?php echo $student['studentID']; ?></td>
<td><?php echo $student['name']; ?></td>
<td><?php echo $student['email']; ?></td>
<td><?php echo $student['GPA'];?></td>
</tr>
<?php endforeach; ?>
</table>
Спасибо за вашу помощь, я нашел проблему
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
document.getElementById("output").innerHTML = this.responseText;
};