如何用<details>和<summary>显示数据库记录

Question

我正在尝试使用HTML5 <details>和<summary>特性来显示数据库中的记录。示例：

CATEGORY | TITLE
Fruit    | Apple
Cars     | Chevrolet
Actors   | Tom Hanks
....

我想显示的数据如下：

Cars

• 雪佛兰
• 福特
• 沃克斯豪尔

演员

• 汤姆·汉克斯
• 哈里森福特
• 梅丽尔·斯特里普
• 塞琳娜·戈麦斯

如何构造HTML中的查询和显示？我尝试了这个查询：

SELECT DISTINCT CATEGORY, TITLE 
FROM   TEST 
GROUP BY CATEGORY

然而，我从我的作品中得到的是这样的东西：

演员

• 汤姆·汉克斯

演员

• 哈里森福特

我需要另一个查询吗？

Answer 1

我们使用cfquery，cfoutput容器来实现这一点。

和cfoutput上的群参数

，这就是它的工作方式：

<cfquery name='dataPuller' datasource='whateverYourDataSourceIs'>
  SELECT DISTINCT CATEGORY, TITLE 
    FROM TEST 
   GROUP BY CATEGORY
   ORDER BY CATEGORY
</cfquery>

<cfoutput query='dataPuller' group='category'>
<strong>#dataPuller.CATEGORY#</strong>
<br>
<li>
  <cfoutput>
    <ul>#dataPuller.TITLE#</ul>
  </cfoutput>
</li>
</cfoutput>

• 注意group参数
• 注意嵌套的cfoutput

希望这会有所帮助:)