31-使用DataList來一行顯示多條記錄

在前兩章的做的DataList的子里我都是使用單列的來顯示數(shù)據(jù).自定義使DataList數(shù)據(jù)顯示在多列多行的table里非常容.而且還可以以單行列來顯示數(shù)據(jù)我們可以通過RepeatColumns和RepeatDirection屬來自定義這個屬性決定了數(shù)據(jù)顯示時候的列數(shù)和方向水平或垂直).是一個3列table來示product信息的DataList子圖1:DataList一顯示三product信通過一行顯示多條記,DataList以更有效的利用屏幕的水平空.在這章里我們將探討這兩個屬性第一步在DataList顯Product息在學(xué)習(xí)和RepeatDirection屬前我們先用標(biāo)準(zhǔn)的單列多行DataList顯Product息我們使用下面的標(biāo)記語言來顯示name,category和price:1

ASP.NET<h4>ProductName</h4>AvailableintheCategoryNamestoreforPrice在前面的教程里我們已經(jīng)做過如何將數(shù)據(jù)綁定到因這一步我們很快帶.打開DataListRepeaterBasics文件夾下的RepeatColumnAndDirection.aspx,拖一個DataList進(jìn)去從的智能標(biāo)簽里創(chuàng)建一個ObjectDataSource,使ProductsBLL類GetProducts方配置在DELETE標(biāo)里選擇None.在創(chuàng)建完ObjectDataSource并定到DataList后VisualStudio會動創(chuàng)建一個顯示product字的name和value的調(diào)整—通過直接修改標(biāo)記語言或智能標(biāo)簽里的EditTemplates選—將ProductName,Category和Price文用Label控來替代,合適的綁定語法將分配的值綁定到屬性在做完這些后,你的頁的標(biāo)記語言看起來應(yīng)該和下面差不:ASP.NET<asp:DataListID="DataList1"runat="server"DataKeyField="ProductID"DataSourceID="ObjectDataSource1"EnableViewState="False"><ItemTemplate><h4><asp:Labelrunat="server"ID="ProductNameLabel"Text='<%#Eval("ProductName")%>'></asp:Label></h4>Availableinthe<asp:Labelrunat="server"ID="CategoryNameLabel"Text='<%#Eval("CategoryName")%>'/>storefor<asp:Labelrunat="server"ID="UnitPriceLabel"Text='<%#Eval("UnitPrice","{0:C}")%>'/></ItemTemplate></asp:DataList><asp:ObjectDataSourceID="ObjectDataSource1"runat="server"2

OldValuesParameterFormatString="original_{0}"SelectMethod="GetProducts"TypeName="ProductsBLL"></asp:ObjectDataSource>注意在UnitPrice的Eval綁語法里我包含了一個格式用來將值轉(zhuǎn)換為貨幣格-Eval("UnitPrice","{0:C}").在瀏覽器里瀏覽這個頁,圖所,DataList以列多行的table顯示product信息.圖2:默情況下顯示一個單列多行的table第二步修的布局向3

默認(rèn)情況下DataList垂直的用單列多行table來顯示項(item).個可以通過RepeatDirection屬性來修改將RepeatDirection屬從Vertical改Horizontal后,DataList會以單行多列顯示數(shù)據(jù)可在設(shè)計器里選擇RepeatDirection屬窗口修改這個屬.修改完后設(shè)計器馬上會調(diào)整的,創(chuàng)建一個單行多列的界(圖3).圖3:RepeatDirection屬用來決定DataList的的布局方向當(dāng)顯示小數(shù)據(jù)量,個單行多列的table是個理想的選.而大數(shù)據(jù)量,單行需要很多列,屏幕會因為顯示不了這么多項而出現(xiàn)水平滾動.圖示在單行的DataList里顯示product信息的情況因的量太多81),戶不得不向右滾動來查看每個product的信.4

圖4:大據(jù)量時單列的DataList會有水平滾動條,第三步以列多行的table來顯示數(shù)據(jù)為了創(chuàng)建多行多列的DataList,我們需要設(shè)置RepeatColumns性為顯示的列.認(rèn)的RepeatColumns屬為0,因此會列或單行的顯示所有的項取決于RepeatDirection屬的).我們將在例子里每行顯示3個product.因設(shè)置RepeatColumns屬為3.做完這個后,瀏覽器里瀏覽頁面如圖5所示product顯以3列行列出5

圖5:每顯示3條productRepeatDirection屬影響DataList的項的布.圖5顯的是為Horizontal的情況注最前面的三個product—andAniseedSyrup—是先從左到,再從上到下列出后面的三個product(從ChefAnton開始)開始三個下面的一行里將RepeatDirection改為Vertical,這product的局為先從上到,再從左到右見圖6.6

圖6:Products垂布局在最后的table里有多少行取決于記錄的總數(shù)除以RepeatColumns的值由于有84條product信息,除以3為28行如還有余,最后的行或列會用的cell填.如果RepeatDirection為那么最后的列會有空cell.果RepeateDirection為Horizontal,那么最后的行有空cell.總結(jié)DataList默情況使用單列多行的tabl