0
注：JQueryは使用できません.JavaScript、PHP、SQL、HTML、およびCSSの混合を使用する必要があります。2番目のJavascript OnClickイベントが機能しません - function（）が定義されていません
私は、Customer Numberをクリックし、個々の顧客の電話番号、営業担当者名、および与信限度を示すdivを表示することができます。
私が実装しているのは、SQLデータベースからデータをフェッチしてレコードをテーブルに出力するときにPHPを実行する方法です。そして、onclickイベントでは、関数（$ orderText）として実装された余分なテーブルがあります。
私が問題を抱えている機能は、2番目の表のcustomerDetails（）です。最初のものは完全に機能します。私は位置が固定されるようにCSSのスタイルシートにスタイルが入っているdivを持っています。
<?php
require_once "dbconfig.php";
try {
$conn = new PDO("mysql:host=$servername;dbname=$dbname;charset=UTF8",
$username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
echo "Connected successfully";
$sql = 'SELECT DISTINCT
O.orderDate, O.customerNumber, O.comments, O.status, O.orderNumber,
OD.productCode, P.productLine, P.productName
FROM orders O
JOIN orderdetails OD on O.orderNumber = OD.orderNumber
JOIN products P ON OD.productCode = P.productCode
WHERE O.status = "In Process"
ORDER BY O.orderNumber';
$q = $conn->query($sql);
$q->setFetchMode(PDO::FETCH_ASSOC);
$sql2 = 'SELECT
O.orderNumber, O.orderDate, O.customerNumber, O.comments, O.status, C.phone, C.salesRepEmployeeNumber as repNumber, C.creditLimit, concat(E.firstName, " ", E.lastName) as repName, E.employeeNumber
FROM orders O
JOIN customers C on O.customerNumber = C.customerNumber
JOIN employees E on C.salesRepEmployeeNumber = E.employeeNumber
ORDER BY O.orderDate desc LIMIT 20';
$q2 = $conn->query($sql2);
$q2->setFetchMode(PDO::FETCH_ASSOC);
}
catch(PDOException $e)
{
echo "Connection failed: " . $e->getMessage();
}
?>
<!doctype html>
<html>
<head>
<title>Page Title</title>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0">
<link rel="stylesheet" href='orders.css'>
</head>
<body>
<div>
<div class="jsbox" id="orderDetails" ></div>
<table>
<thead>
<tr>
<th>Order Number</th>
<th>Order Date</th>
<th>Status</th>
<th>Customer Number</th>
</tr>
</thead>
<tbody>
<?php while ($r = $q->fetch()): ?>
<?php $text = "<table><tr><th>Product Code</th><th>Product Line</th><th>Product Name</th><th>Comments</th>";
$text .= "<tr><td>" . htmlspecialchars($r['productCode']) . "</td>";
$text .= "<td>" . htmlspecialchars($r['productLine']) . "</td>";
$text .= "<td>" . htmlspecialchars($r['productName']) . "</td>";
$text .= "<td>" . htmlspecialchars($r['comments']) . "</td></table>" ?>
<tr>
<td ><?php echo "<button onclick=\"myFunction('$text')\">" . htmlspecialchars($r['orderNumber']) . "</button>" ?></td>
<td><?php echo htmlspecialchars($r['orderDate']) ?></td>
<td><?php echo htmlspecialchars($r['status']) ?></td>
<td><?php echo htmlspecialchars($r['customerNumber']) ?></td>
</tr>
<?php endwhile; ?>
</tbody>
</table>
</div>
<script type="text/javascript">
function myFunction(msg) {
document.getElementById("orderDetails").innerHTML = msg;
}
</script>
<div>
<div class="jsbox" id="customerOrderDetails" ></div>
<table>
<thead>
<tr>
<th>Order Number</th>
<th>Order Date</th>
<th>Status</th>
<th>Customer Number</th>
</tr>
</thead>
<tbody>
<?php while ($s = $q2->fetch()): ?>
<tr>
<?php $orderText = "<table><tr><th>Phone Number</th><th>Rep Name</th><th>Credit Limit</th>";
$orderText .= "<tr><td>" . htmlspecialchars($s['phone']) . "</td>";
$orderText .= "<td>" . htmlspecialchars($s['repName']) . "</td>";
$orderText .= "<td>" . htmlspecialchars($s['creditLimit']) . "</td></tr></table>"; ?>
</tr>
<tr>
<td><?php echo htmlspecialchars($s['orderNumber']) ?></td>
<td><?php echo htmlspecialchars($s['orderDate']) ?></td>
<td><?php echo htmlspecialchars($s['status']) ?></td>
<td><?php echo "<button onclick=\"customerDetails('$orderText')\">" . htmlspecialchars($s['customerNumber']) . "</button>" ?></td>
</tr>
<?php endwhile; ?>
</tbody>
</table>
</div>
<script type="text/javascript">
function customerOrder(msg) {
document.getElementById("customerDetails").innerHTML = msg;
}
</script>
</body>
</html>
ので、特に私は修正する必要がある領域には、セミコロンを忘れた
<div>
<div class="jsbox" id="customerOrderDetails" ></div>
<table>
<thead>
<tr>
<th>Order Number</th>
<th>Order Date</th>
<th>Status</th>
<th>Customer Number</th>
</tr>
</thead>
<tbody>
<?php while ($s = $q2->fetch()): ?>
<tr>
<?php $orderText = "<table><tr><th>Phone Number</th><th>Rep Name</th><th>Credit Limit</th>";
$orderText .= "<tr><td>" . htmlspecialchars($s['phone']) . "</td>";
$orderText .= "<td>" . htmlspecialchars($s['repName']) . "</td>";
$orderText .= "<td>" . htmlspecialchars($s['creditLimit']) . "</td></tr></table>"; ?>
</tr>
<tr>
<td><?php echo htmlspecialchars($s['orderNumber']) ?></td>
<td><?php echo htmlspecialchars($s['orderDate']) ?></td>
<td><?php echo htmlspecialchars($s['status']) ?></td>
<td><?php echo "<button onclick=\"customerDetails('$orderText')\">" . htmlspecialchars($s['customerNumber']) . "</button>" ?></td>
</tr>
<?php endwhile; ?>
</tbody>
</table>
</div>
<script type="text/javascript">
function customerOrder(msg) {
document.getElementById("customerDetails").innerHTML = msg;
}
</script>
と思っていた顧客と顧客詳細は同じでした。脳の揚げた.. – HappyChristmas