ASP.NET 3.5 引入 ListView,以完全模板化設計取代 GridView 固定表格結構,給予開發者對 HTML 輸出的完全控制權,支援 CRUD、分頁、群組、排序等豐富功能。
| 模板 | 用途 | 必要性 |
|---|---|---|
| LayoutTemplate | 根容器(ul、table、div),含 itemPlaceholder | 必要 |
| ItemTemplate | 單筆資料呈現 | 必要 |
| AlternatingItemTemplate | 交替列樣式 | 選用 |
| EditItemTemplate | 編輯模式呈現 | 啟用編輯時必要 |
| InsertItemTemplate | 新增模式呈現 | 啟用插入時必要 |
| SelectedItemTemplate | 選中狀態呈現 | 啟用選擇時必要 |
| EmptyDataTemplate | 無資料時顯示 | 選用 |
| GroupTemplate / GroupSeparatorTemplate | 群組容器與分隔 | 群組顯示時 |
| ItemSeparatorTemplate | 項目間分隔 | 選用 |
<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1">
<LayoutTemplate>
<table>
<tr runat="server" id="itemPlaceholder"></tr>
</table>
</LayoutTemplate>
<ItemTemplate>
<tr>
<td><%# Eval("ProductName") %></td>
<td><%# Eval("UnitPrice", "{0:C}") %></td>
</tr>
</ItemTemplate>
</asp:ListView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="..."
SelectCommand="SELECT ProductName, UnitPrice FROM Products" />
LayoutTemplate 中的 <tr runat="server" id="itemPlaceholder"> 是固定命名占位符,ListView 將每筆資料渲染的 ItemTemplate 內容插入此位置。容器標籤可為 table、ul、ol、div 任意結構。
| 特性 | GridView | ListView |
|---|---|---|
| HTML 結構 | 固定 table/tr/td | 完全自訂 |
| CSS 友善度 | 低(類名固定、結構死板) | 高(任意 class、data-*、語意標籤) |
| CRUD 內建 | 有(但彈性低) | 有(模板化、彈性高) |
| 分頁 | 內建 PagerSettings | 外掛 DataPager(更靈活) |
| 群組顯示 | 不支援 | 支援 GroupTemplate |