【发布时间】:2013-10-03 16:00:05
【问题描述】:
我正在制作一个简单的表格,它使用 jdbc 连接存储来自数据库的产品详细信息。
我的桌子是这样的:
<table>
<td>
<img border="3"
src="image path" height="200" width="200" />
<p align="center"></p> // these tag contains specific product details from db
<p align="center"></p>
</td>
</table>
现在我正在获取特定列中的每个产品详细信息(即单行中的多列),但我的问题是这一行不断扩展,我希望这一行(由多列组成)自动中断让每 5 件产品再说一次。
简单来说,我想像在 Flipkart 中一样以 4 x n 格式排列我的产品详细信息,如下所示:
您可以看到第一个产品 sony experia 然后 lg 然后在 samsung Galaxy 产品之后,新行开始,然后又是 4 个产品,然后是新行。这样,我需要使用 jdbc 连接显示来自数据库的产品。
谁能建议我实现这一目标的最佳方法是什么。 & 是否有任何选项可以在第 4 个之后断开列然后开始新行?
我在jsp中显示数据库内容如下图,只是为了演示:
<%
//1. Retrieve all products from database
//1a. Load the Driver
Class.forName("com.mysql.jdbc.Driver");
//1b. Get a connection to the database
Connection con = DriverManager.getConnection("url", "un", "pwd
PreparedStatement ps = con.prepareStatement("SELECT * FROM table");
//1d. Execute and retrieve our result
ResultSet rs = ps.executeQuery();
//2. Base on the results returned, construct a table
%>
</p>
<table border="0">
<%
if(rs.next()) {
rs.beforeFirst(); // for making sure you dont miss the first record.
while(rs.next())
{ // opening while loop brackets.
%>
<td>
<div style=""><img border="3"
src="<%=rs.getString("image") %>" height="200" width="200" /></div>
<p align="center"><%=rs.getString("title")%></p>
<p align="center"><%=rs.getString("price")%></p>
</td>
<%
} //closing while loop bracket
}
else {
//if no record is found, simply display a no record message
%>
Nothing.
<%
}
%>
</table>
【问题讨论】:
-
<tr>和</tr>在这里可能会有所帮助。 -
使用 div 而不是 table 来实现流畅的布局...根据屏幕宽度流到下一行的布局。
-
@AC1 我使用 div 而不是 table 进行液体布局,但产品随后出现在另一个之下。接下来我应该使用什么?
-
你试过css属性了吗:display:inline;位置:相对; float:left 用于 div 吗?
标签: java html jsp jdbc html-table