我在html中有一个表格,如下所示:
<table class="sortable draggable">
<thead>
<tr>
<th class="col-salesOrderId">Order Number</th>
<th class="col-orderDate">Date of Order</th>
<th class="col-party">Party</th>
<th class="col-edit">Edit</th>
<th class="col-delete">Delete</th>
</tr>
</thead>
<tbody>
{#orders}
<tr>
<td class="col-salesOrderId">{.salesOrderId}</td>
<td class="col-orderDate">{@formatDate date=orderDate format="DD-MM-YYYY" /}</td>
<td class="col-party">{.party.partyName}</td>
<td class="col-edit">
<button class="btn btn-info btn-edit">
</button>
</td>
<td class="col-delete">
<button class="btn btn-danger btn-delete">
</button>
</td>
</tr>
<tr>
<table class="sortable draggable row-details">
<thead>
<tr>
<th class="col-itemName">Item Name</th>
<th class="col-quantity">Quantity</th>
<th class="col-rate">Rate</th>
<th class="col-amount">Amount</th>
</tr>
</thead>
<tbody>
{#items}
<tr>
<td>{.item.itemName}</td>
<td>{.quantity}</td>
<td>{.rate}</td>
<td>{.quantity * .rate}</td>
</tr>
{/items}
</tbody>
</table>
</tr>
{/orders}
</tbody>
</table>
我得到如下所示的输出:
为什么我会得到这样的输出?我希望看到嵌套表。
答案 0 :(得分:1)
您需要将子Error Code: 1054. Unknown column 'database.Table_2.CYCLE' in 'where clause'
标记嵌套在<table>
标记内,而不是<td>
标记内。这样做可以使其正确显示,因为只有<tr>
或<td>
标记可以直接放在<th>
标记内。
答案 1 :(得分:1)
<table>
<tr>
<td> <!-- must be in td -->
<table> <!-- nested table -->
<tr>
<td>
</td>
</tr>
</table>
</td>
</tr>
</table>
你的嵌套表需要在td或th之内。
答案 2 :(得分:1)
您的HTML有几处错误,从此开始:
{#orders}
正如其他人所说,这也很糟糕:
<tr>↩ <table class="sortable draggable row-details"
帮自己一个大忙,并开始使用像W3C's这样的HTML验证器。它会很快发现这样的问题。 (它还会发现其他可能需要修复的东西,但是当它有所帮助时,它会节省很多时间。)
此外,开始使用Chrome检查器查看标记失误时的操作。在这种情况下,您可以看到Chrome关闭了您的第一个表,而不是嵌套它。当Chrome使用您的HTML混乱时,这表明您可能在该位置发生错误。
</tr></tbody></table>
{#items}
{/items}
<table class="sortable draggable row-details">
<thead>
<tr>
<th class="col-itemName">Item Name</th>
<th class="col-quantity">Quantity</th>
答案 3 :(得分:0)
<table>
代码必须位于<td>
或<th>
标记内才能嵌套。在您的代码中,您已将<table>
标记作为<tr>
标记的子标记,这是错误的。它应该是<td>
或<th>
的孩子。
在<td>
和<th>
之间插入<tr>
或<table>
会正确显示输出。
以下是工作链接供参考: Nested Tables in HTML
实施例:
<table border="1">
<thead>
<tr>
<th>Item 1
<th>Item 2
</tr>
</thead>
<tbody>
<tr>
<td>
<table border="1">
<tr>
<td>1
<td>2
</tr>
<tr>
<td>1
<td>2
</tr>
</table>
<td>A
</tr>
</tbody>
</table>
&#13;