php - 使用来自 mySQL 的数据填充 HTML DIV
问题描述
我有一个 MySQL 数据库"dorav3"
,其中有一个表"dtab1"
,下面的列包含名片信息。我还有一个 php 脚本和 HTML 页面,用于在 HTML 表中显示数据库数据。
我的问题是我怎样才能从填充表格到填充下面的翻转卡
我目前 <td><?php echo $row1[0];?></td>
为桌子做的地方
我应该为翻转卡做些什么吗?
<body>
<div class="flip-box">
<div class="flip-box-inner">
<div class="flip-box-front">
<h2><?php echo $row1[0];?></h2>
<h2><?php echo $row1[1];?></h2>
</div>
<div class="flip-box-back">
<h4><?php echo $row1[2];?></h4>
<h4><?php echo $row1[3];?></h4>
<h4><?php echo $row1[4];?></h4>
</div>
</div>
</div>
我真的被困住了!
+--------------------+---------+------+-----+---------+----------------+
| Field | Type | Null | Key | Default | Extra |
+--------------------+---------+------+-----+---------+----------------+
| Title | text | YES | | NULL | |
| Name | text | YES | | NULL | |
| Email | text | YES | | NULL | |
| Website | text | YES | | NULL | |
| Contact | text | YES | | NULL | |
| id | int(11) | NO | PRI | NULL | auto_increment |
----------------------------------------------------------------------
PHP
<?php
// php populate html table from mysql database
$hostname = "localhost";
$username = "xxx";
$password = "xxx";
$databaseName = "dorav3";
// connect to mysql
$connect = mysqli_connect($hostname, $username, $password, $databaseName);
// mysql select query
$query = "SELECT * FROM `dtab1";
// result for method one
$result1 = mysqli_query($connect, $query);
// result for method two
$result2 = mysqli_query($connect, $query);
$dataRow = "";
while($row2 = mysqli_fetch_array($result2))
{
$dataRow = $dataRow."<td>$row2[0]</td><td>$row2[1]</td><td>$row2[2]</td><td>$row2[3]</td><td>$row2[4]</td><td>$row2[5]</td><td>$row2[6]</td><td>$row2[7]</td><td>$row2[8]</td><td>$row2[9]</td><td>$row2[10]</td><td>$row2[11]</td><td>$row2[12]</td><td>$row2[13]</td><td>$row2[14]</td><td>$row2[15]</td>";
}
?>
填充表格的 HTML
<body>
<table>
<tr>
<th>Title</th>
<th>Name</th>
<th>Email</th>
<th>Website</th>
<th>Contact</th>
</tr>
</table>
<?php while($row1 = mysqli_fetch_array($result1)):;?>
<table>
<tr>
<td><?php echo $row1[0];?></td>
<td><?php echo $row1[1];?></td>
<td><?php echo $row1[2];?></td>
<td><?php echo $row1[3];?></td>
<td><?php echo $row1[4];?></td>
</tr>
</table>
<?php endwhile;?>
</body>
</html>
我接下来要做的是用我的数据填充更丰富的格式。
用于填充卡片的 HTML
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="flip-box">
<div class="flip-box-inner">
<div class="flip-box-front">
<h2>Title</h2>
<h2>Name</h2>
</div>
<div class="flip-box-back">
<h4>Email</h4>
<h4>Website</h4>
<h4>Contact</h4>
</div>
</div>
</div>
<div class="flip-box">
<div class="flip-box-inner">
<div class="flip-box-front">
<h2>Title</h2>
<h2>Name</h2>
</div>
<div class="flip-box-back">
<h4>Email</h4>
<h4>Website</h4>
<h4>Contact</h4>
</div>
</div>
</div>
<div class="flip-box">
<div class="flip-box-inner">
<div class="flip-box-front">
<h2>Title</h2>
<h2>Name</h2>
</div>
<div class="flip-box-back">
<h4>Email</h4>
<h4>Website</h4>
<h4>Contact</h4>
</div>
</div>
</div>
</div>
</body>
</html>
解决方案
我并没有真正得到你想做的事情,但我认为这应该可行:
<?php while($row1 = mysqli_fetch_array($result1)):;?>
<div class="flip-box">
<div class="flip-box-inner">
<div class="flip-box-front">
<h2><?php echo $row1[0];?></h2>
<h2><?php echo $row1[1];?></h2>
</div>
<div class="flip-box-back">
<h4><?php echo $row1[2];?></h4>
<h4><?php echo $row1[3];?></h4>
<h4><?php echo $row1[4];?></h4>
</div>
</div>
</div>
<?php endwhile;?>
推荐阅读
- python - 如何使用它之外的 DEF 语句内部的值?
- javascript - Javascript:将对象分配给变量
- python - if-else 语句中的语法无效
- reactjs - 带箭头的小数增加 - 文本字段材质 UI
- php - wp_categories_dropdown 在“option_none_value”中动态添加默认 slug 名称
- javascript - 当我更改为不同的类名时,getElementsByClassName 不起作用
- php - 每种用户类型的起始编号不同
- android - Kotlin DSL 添加新的 sourceSet
- http - 下载期间连接重置 - 谁来重置?IIS?
- hyperledger-fabric - 由于无法评估事务而出现错误:错误:没有策略的事件中心