#雇员{ /*保证金：自动*/ 边框：1px实心#ccc； } #员工类型{ 边缘顶部：20px； 边框：1px实心#ccc； } 员工 名字 姓 员工ID 员工类型 服务器 调酒师 主机 get-employee.php Q1:它是assign3js.
#雇员{ /*保证金：自动*/ 边框：1px实心#ccc； } #员工类型{ 边缘顶部：20px； 边框：1px实心#ccc； } 员工 名字 姓 员工ID 员工类型 服务器#雇员{ /*保证金：自动*/ 边框：1px实心#ccc； } #员工类型{ 边缘顶部：20px； 边框：1px实心#ccc； } 员工 名字 姓 员工ID 员工类型 服务器 调酒师 主机 get-employee.php Q1:它是assign3js.,php,sql,ajax,Php,Sql,Ajax,#雇员{ /*保证金：自动*/ 边框：1px实心#ccc； } #员工类型{ 边缘顶部：20px； 边框：1px实心#ccc； } 员工 名字 姓 员工ID 员工类型 服务器 调酒师 主机 get-employee.php Q1:它是assign3js.js=script.js吗？问题2：哪个名称包含带有html代码的页面？它也是“server.php”吗？问题3：为什么在表单的操作中使用“？”？问题2：assign3.php包含html。问题3：我不知道为什么会这样？我的老师就是这样教的。但
调酒师
主机
get-employee.php
Q1:它是assign3js.js=script.js吗？问题2：哪个名称包含带有html代码的页面？它也是“server.php”吗？问题3：为什么在表单的操作中使用“？”？问题2：assign3.php包含html。问题3：我不知道为什么会这样？我的老师就是这样教的。但是我现在并没有对那个特定的代码块做任何事情，所以我把它从问题中删除了后接ini\u集（'display\u errors'，1）。是否显示任何php错误？添加该代码时，我没有看到显示任何php错误。我对其进行了测试，唯一可行的方法是将[0]放在那里，至少对我来说是这样。JSON是[{some data}]]，如果没有[0]，它将无法工作。我对JSON不太熟悉，但我的理解是，我需要[0]来选择第一个对象，因为我选择的数组位于一个数组中。你说得对！对我来说，这是<代码> [{…}，{…}，{…} }/CODE >，但我正处于测试另一个代码变体的中间。您可以添加一些类似于控制台的日志（数据）吗？在update函数的开头，告诉我们当您单击ajax按钮时控制台中会显示什么？它应该打印出ajax请求返回的数据。然后您必须在js中的update（）
函数中使用jquery函数，而不是普通javascript的for
语句。Alex，干得好！；-）我喜欢你的回答和详细的评论。祝你好运
//assign3.php
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src = "http://code.jquery.com/jquery-3.2.1.min.js">
</script>
<script src ="js/assign3js.js" type = "text/javascript" ></script>
</head>
<body>
<table border ='1'style = 'margin:auto' id = "employees" >
<tr><td colspan ='3'><h1>Employees </h1></td></tr>
<th> First Name</th>
<th>Last Name</th>
<th>Employee ID</th>
</table>
<input type="radio" name="employeeType" value="server" id="server"> Server<br>
<input type="radio" name="employeeType" value="bartender"id="bartender"> Bartender<br>
<input type="radio" name="employeeType" value="host"id = "hosts"> Host<br>
</body>
$("document").ready(
function()
{
$("#server").click(doAjax);
$("#hosts").click(doAjax1);
$("#bartender").click(doAjax2);
}
);
function doAjax()
{
$.ajax({"method":"POST","url":"servers.php"}).done(update);
}
function update(data)
{
result = JSON.parse(data);
for(index =0; index < result.length; index++)
{
var row = "<tr>";
row += "<td>" + result[index].firstName + "</td>";
row += "<td>" + result[index].lastName + "</td>";
row += "<td>" + result[index].employeeID + "</td>";
row += "</tr>";
$("#employees").append(row);
}
}
<?php
$server = (object) null;
$connection = "mysql:host=localhost;dbname=restaurant";
$user = "root";
$pwd = "mysql";
$db = new PDO($connection, $user, $pwd);
$results = $db->query("SELECT firstName, lastName, employeeID FROM
employee JOIN `server` ON employee.employeeID = server.employeeID");
while ($row = $results->fetch())
{
$server->firstName= $row["firstName"];
$server-> lastName=$row["lastName"] ;
$server->employeeId = $row["employeeID"];
}
$employee = [];
array_push($employee,$server);
$json1 = json_encode($employee);
echo $json1;
?>
SELECT firstName, lastName, employeeID FROM employee JOIN `server` ON
employee.employeeID = server.employeeID
SELECT employee.firstName, employee.lastName, employee.employeeID FROM employee JOIN `server` ON
employee.employeeID = server.employeeID
$server->employeeID = $row["employeeID"];
...
$server = [];
...
$count = 0;
while ($row = $results->fetch()) {
//create new class to stop warnings of creating object from empty value
$server[$count] = new \stdClass();
$server[$count]->firstName= $row["firstName"];
$server[$count]->lastName=$row["lastName"] ;
$server[$count]->employeeID = $row["employeeID"];
$count++;
}
...
function update(data) {
var result = JSON.parse(data)[0]; // [0] because the json was wrapped in
// double []'s
for(var index =0; index < result.length; index++) {
var row = "<tr>";
row += "<td>" + result[index].firstName + "</td>";
row += "<td>" + result[index].lastName + "</td>";
row += "<td>" + result[index].employeeID + "</td>";
row += "</tr>";
$("#employees").append(row);
}
}
$(document).ready(function () {
$('input[name="employeeType"]').click(function () {
var employeeType = $(this).val();
updateEmployees(employeeType);
});
});
function updateEmployees(type) {
$.ajax({
method: 'post',
dataType: 'json',
url: 'get-employee.php',
data: {
'type': type
}
})
.done(function (response, textStatus, jqXHR) {
if (response) {
for (var i = 0; i < response.length; i++) {
var row = '<tr>';
row += '<td>' + response[i].firstName + '</td>';
row += '<td>' + response[i].lastName + '</td>';
row += '<td>' + response[i].employeeID + '</td>';
row += '</tr>';
$('#employees tbody').append(row);
}
} else {
$('#employees tbody').append('<tr><td colspan="3">No employees found</td></tr>');
}
})
.fail(function (jqXHR, textStatus, errorThrown) {
// alert(textStatus + '\n' + errorThrown + '\n\n' + jqXHR.responseText);
})
.always(function (response, textStatus, jqXHR) {
//...
});
}
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" />
<meta charset="UTF-8" />
<!-- The above 3 meta tags must come first in the head -->
<title>Demo</title>
<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="js/assign3js.js" type="text/javascript"></script>
<style type="text/css">
#employees {
/*margin: auto;*/
border: 1px solid #ccc;
}
#employee-types {
margin-top: 20px;
border: 1px solid #ccc;
}
</style>
</head>
<body>
<table id="employees">
<thead>
<tr>
<th colspan="3">
<h1>Employees</h1>
</th>
</tr>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Employee ID</th>
</tr>
</thead>
<tbody></tbody>
</table>
<fieldset id="employee-types">
<legend>Employee type</legend>
<input type="radio" id="server" name="employeeType" value="server">
<label for="server">Server</label><br/>
<input type="radio" id="bartender" name="employeeType" value="bartender">
<label for="bartender">Bartender</label><br/>
<input type="radio" id="hosts" name="employeeType" value="host">
<label for="hosts">Host</label><br/>
</fieldset>
</body>
</html>
<?php
// Db configs.
define('HOST', 'localhost');
define('PORT', 3306);
define('DATABASE', 'restaurant');
define('USERNAME', 'root');
define('PASSWORD', 'mysql');
define('CHARSET', 'utf8');
// Error reporting.
error_reporting(E_ALL);
ini_set('display_errors', 1); // SET IT TO 0 ON A LIVE SERVER!
//
// Create a PDO instance as db connection to db.
$connection = new PDO(
sprintf('mysql:host=%s;port=%s;dbname=%s;charset=%s', HOST, PORT, DATABASE, CHARSET)
, USERNAME
, PASSWORD
, [
PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
PDO::ATTR_EMULATE_PREPARES => FALSE,
PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
]
);
$response = false;
if (isset($_POST['type'])) {
$employeeType = $_POST['type'];
/*
* The bindings array, mapping the named markers from the sql statement
* (if any) to the corresponding values. It will be directly passed as
* argument to the PDOStatement::execute method.
*
* @link http://php.net/manual/en/pdostatement.execute.php
*/
$bindings = [];
// Set the sql statement based on the submitted employee type.
switch ($employeeType) {
case 'bartender':
// $sql = '...';
// $bindings[:markerName] = markerValue;
break;
case 'hosts':
// $sql = '...';
// $bindings[:markerName] = markerValue;
break;
case 'server':
default:
$sql = 'SELECT
emp.firstName,
emp.lastName,
emp.employeeID
FROM employee AS emp
JOIN `server` AS srv ON srv.employeeID = emp.employeeID';
break;
}
// Prepare the sql statement for execution and return a statement object.
$statement = $connection->prepare($sql);
// Execute the prepared statement.
$statement->execute($bindings);
// Fetch data - all at once - and save it into response array.
$response = $statement->fetchAll(PDO::FETCH_ASSOC);
//-----------------------------------------------------------------------
// ...or fetch data one record at a time and save it into response array.
//-----------------------------------------------------------------------
// $employee = [];
// while ($row = $statement->fetch(PDO::FETCH_ASSOC)) {
// $employee[] = $row;
// }
// $response = $employee;
//-----------------------------------------------------------------------
}
echo json_encode($response);