3.利用Repeater組件顯示數據集

相關介紹

ASP.NET中數據的顯示多種多樣，其中Repeater是另外一個已有的組件。DataGrid總是會以”表格”來展示數據，當我們想用更自由的方式來展示數據著一定會用到Repeater控件,

它以Template(樣板)的方式來定義數據輸出格式。

STEP 1. 建立頁面
我們可以通過更改原有的頁面來建立用Repeater組件顯示數據。將Location1.htm重命名為Location1.aspx。刪除頁面中原有的部分，并像上一章一樣建立Dataset,其中篩選Region_IDEnterValue=1。下面讓我們用Repeater控件來做動態頁面。

j為了利用樣板定義輸出格式，先建立表格。我們可以通過ApplicationàDatabases頁面看

數據庫的結構。

Dreamweaver/10208/pic/08161image002.jpg">

[圖3-1 數據庫結構]

根據數據庫的結構，設計下列的表格。



[圖3-2 模版圖]

k下面需要將數據綁定到表格中。將Application面板中Bindings中的數據項拖到其位置中。



[圖3-3 Binding對話框]

數據綁定后得到如下頁面:



[圖3-4數據綁定后的頁面]

是否有點似曾相識的感覺，因為Dreamwaver MX繼承了UltraDev的傳統以高亮顯示數據。 ③ 其中Binding對話框中也可以選擇數據表示的形式，點選頁面的數據項后可在Binding中相應的數據選擇數據表示的形式。



[圖3-5 數據表示的形式]

若要以此表格為樣板顯示所有數據項，則需全選此表格。單擊Application面板中的Server Behaviors項中的”+”，選擇Repeat Region項



[圖3-6選擇Repeat Region] [圖 3-7 選擇重復的方式]

在Repeat Region中確定想重復的方式，單擊OK。現在就可以按”F12”預覽頁面了。 
STEP 2 分析代碼(注意：為了能顯示代碼，以下所有代碼都在“<”之后和“>”之前加了空格，不便之處請多原諒！)

< ASP:Repeater runat="server" DataSource='< %# DataSet1.DefaultView % >' >

< ItemTemplate >

< table width="75%" border="0" >

< tr >

< td width="18%" >Location Name< /td >

< td colspan="3" > < %# DataSet1.FieldValue("LOCATION_NAME", Container) % > < /td >

< /tr >

< tr >

< td >City< /td >

< td width="35%" > < %# DataSet1.FieldValue("CITY", Container) % > < /td >

< td width="19%" >Address< /td >

< td width="28%" > < %# DataSet1.FieldValue("ADDRESS", Container) % > < /td >

< /tr >

< tr >

< td >State< /td >

< td > < %# DataSet1.FieldValue("STATE_COUNTRY", Container) % > < /td >

< td >Code< /td >

< td > < %# DataSet1.FieldValue("CODE", Container) % > < /td >

< /tr >

< tr >

< td >Telephone< /td >

< td > < %# DataSet1.FieldValue("TELEPHONE", Container) % > < /td >

< td >Fax< /td >

< td > < %# DataSet1.FieldValue("FAX", Container) % > < /td >

< /tr >

< /table >

< /ItemTemplate >

< /ASP:Repeater >

ASP.net是通過建立一個ItemTemple的模板來重復顯示所有數據的，所以若要設置Repeater的樣式，可以通過設置模板來實現。

我們還可以通過添加其他樣板來達到我們要的效果。

AlternatingItemTemplate : 實現交叉顯示數據。與原ItemTemplate的模板交叉顯示數 據

SepartorTemplate: 分隔符樣板。可用于分隔數據行。

HeaderTemplate: 標題樣板。顯示與所有數