如何使用 Jsp 和 Mysql 将列转换为行？答案

【问题标题】：How to convert columns to rows with Jsp and Mysql?如何使用 Jsp 和 Mysql 将列转换为行？
【发布时间】：2015-04-23 08:34:21
【问题描述】：

我有一个从数据库获取动态数据的表。 SQL 自然会按列显示数据：

<table style="border: 1px none ;" border="1">
<tbody>
    <tr>
        <td>Player_picture</td>
        <td>Player_Name</td>
        <td>Age</td>
        <td>#Games</td>
        <td>Average_score</td>
    </tr>
</tbody>
</table>

我想将列转换为行并像这样在浏览器中显示：

<table style="border: 1px none ; width: 703px;" border="1">
  <tbody>
    <tr>
      <td colspan="1" rowspan="5" style="vertical-align: top; width: 173px;">Row#1
        <br>
      </td>
      <td style="width: 242px;">Player#1 (picture)</td>
      <td style="width: 270px;">Player#2 (picture)</td>
      <td style="width: 240px;">Player#3 (picture)</td>
    </tr>
    <tr>
      <td style="vertical-align: top; width: 242px;">Name</td>
      <td style="vertical-align: top; width: 270px;">Name</td>
      <td style="vertical-align: top; width: 240px;">Name</td>
    </tr>
    <tr>
      <td style="vertical-align: top; width: 242px;">Age</td>
      <td style="vertical-align: top; width: 270px;">Age</td>
      <td style="vertical-align: top; width: 240px;">Age</td>
    </tr>
    <tr>
      <td style="vertical-align: top; width: 242px;">#Games</td>
      <td style="vertical-align: top; width: 270px;">#Games</td>
      <td style="vertical-align: top; width: 240px;">#Games</td>
    </tr>
    <tr>
      <td style="vertical-align: top; width: 242px;">Average_score</td>
      <td style="vertical-align: top; width: 270px;">Average_score</td>
      <td style="vertical-align: top; width: 240px;">Average_score</td>
    </tr>
    <tr>
      <td colspan="1" rowspan="5" style="vertical-align: top; width: 173px;">Row#2
        <br>
      </td>
      <td style="width: 242px;">Player#4 (picture)</td>
      <td style="width: 270px;">Player#5 (picture)</td>
      <td style="width: 240px;">Player#6 (picture)</td>
    </tr>
    <tr>
      <td style="vertical-align: top; width: 242px;">Name</td>
      <td style="vertical-align: top; width: 270px;">Name</td>
      <td style="vertical-align: top; width: 240px;">Name</td>
    </tr>
    <tr>
      <td style="vertical-align: top; width: 242px;">Age</td>
      <td style="vertical-align: top; width: 270px;">Age</td>
      <td style="vertical-align: top; width: 240px;">Age</td>
    </tr>
    <tr>
      <td style="vertical-align: top; width: 242px;">#Games</td>
      <td style="vertical-align: top; width: 270px;">#Games</td>
      <td style="vertical-align: top; width: 240px;">#Games</td>
    </tr>
    <tr>
      <td style="vertical-align: top; width: 242px;">Average_score</td>
      <td style="vertical-align: top; width: 270px;">Average_score</td>
      <td style="vertical-align: top; width: 240px;">Average_score</td>
    </tr>
  </tbody>
</table>

SQL 查询：

<sql:query var="categoryPlayers" dataSource="jdbc/database">
    SELECT * FROM player WHERE category_id = ?
    <sql:param value="${pageContext.request.queryString}"/>
</sql:query>

然后在JSP中这样显示：

<c:forEach var="player" items="${categoryPlayers.rows}" varStatus="iter"></c:forEach>

【问题讨论】：

其实你想要什么输出？你有什么问题？
@ketan：我不知道如何将动态行转换为动态列

标签： html mysql jsp

【解决方案1】：

您可以做的一件事是在单独的变量中生成每一列的内容，然后在表中输出变量：

<%@ page import="java.util.ArrayList" %>
<html>
<head>
<title>Hello World</title>
</head>
<body>

<%
    ArrayList<String> list = new ArrayList<String>();
    list.add("player0");
    list.add("player1");

    String picture = "";
    String name = "";
    String age = "";
    String games = "";
    String avgSc = "";

    for (String s : list) {
        picture += "<td>" + s + "</td>";
        name += "<td>" + s + "</td>";
        age += "<td>" + s + "</td>";
        games += "<td>" + s + "</td>";
        avgSc += "<td>" + s + "</td>";
    }

%>

<table style="border: 1px none ; width: 438px;" border="1">
<tbody>
    <tr>
        <td>Player_picture</td>
        <%=picture%>
    </tr>
    <tr>
        <td style="vertical-align: top;">Player_Name</td>
        <%=name%>
    </tr>
    <tr>
        <td style="vertical-align: top;">Age</td>
        <%=age%>
    </tr>
    <tr>
        <td style="vertical-align: top;">#Games</td>
        <%=games%>
    </tr>
    <tr>
        <td style="vertical-align: top;">Average_score</td>
        <%=avgSc%>
    </tr>
</tbody>
</table>

</body>
</html>

【讨论】：

但是如果数据库中有数百名玩家，如果我每一个都输入的话，那将是一个非常漫长的夜晚。数据通过查询自动从数据库中检索（就像在我的帖子中一样）并显示在 JSP 中，并带有 ${player.name}、${player.age} 等语句。你还会建议使用你的方法吗？
我给了你一个可行的解决方案，但不是最好的。您还需要做一些您知道的工作:) 通常当您必须处理许多记录时，您需要实现分页机制。
非常感谢！我还没有尝试过您的代码...我正在尝试弄清楚如何使用它，以便在加载表格时动态完成。这样我就不用输入所有玩家了...
嗯，你需要用你的数据替换我静态创建的列表。您可以按照本教程实现这一目标：docs.oracle.com/javase/tutorial/jdbc/basics/…。另外，我建议集成像 Spring MVC 这样的 MVC 框架，以获得更简洁的代码和层分离。

【解决方案2】：

您可以使用 JQuery 完成这种棘手的方法。检查以下内容。

$("td:nth-child(3n)").after("&lt;td class='newline'&gt;&lt;/td&gt;");

td{
  display:inline-block;
  }
.newline{
  display:block;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table style="border: 1px none ;" border="1">
<tbody>
    <tr>
        <td>Player_picture</td>
        <td>Player_Name</td>
        <td >Age</td>
        <td >#Games</td>
        <td>Average_score</td>
      <td >#Games</td>
      <td>Average_score</td>
    </tr>
</tbody>
</table>

【讨论】：