導言
在第一部分我們研究了DataGrid的基本功能
它可在HTML表格中顯示數據
在第一部分我麼說明了將數據庫內容綁定至DataGrid是非常簡單的
我們所要做的就是通過SQL查詢來生成一個DataReader對象
將DataGrid的DataSource屬性設為這個DataReader對象
然後調用DataGrid對象的DataBind()方法
剩下的事情就是將DataGrid放置到HTML中
它可通過如下代碼實現
<asp:datagrid runat=
server
/>
就是這麼簡單
遺憾的是通過這種簡單方法生成的DataGrid並不美觀
生成的DataGrid僅僅是一個封裝了DataReader中所有列和行的簡單的HTML表格
我們希望做到的是僅顯示DataReader中的部分列並且設定每一列的格式
並且希望設定諸如背景顏色
字體等可以應用到整個表格的格式
最後
如果能夠為每一列加上自定義的標題就更好了
例如設定標題的背景色為不同的顏色或字體為粗體
在這部分我們將研究如何完成所有這些任務!(DataGrid可以做更多的事情
我們將在今後一系列文章中看到如何對數據庫結果進行分頁顯示
允許用戶對數據排序等
)
設定DataGrid格式
對於DataGrid我們有兩種設定格式的方法
第一種方法是在服務器端代碼中通過程序進行設定
例如為了將DataGrid的背景色設定為紅色
可使用如下服務器端代碼
<%@ Import Namespace=
System
Drawing
%>
<script runat=
server
>
sub Page_Load(sender as Object
e as EventArgs)
DataGridID
BackColor = Color
Red
end sub
</script>
另一種設定顯示屬性的方法是在DataGrid Web控件的標記中進行設定
下面的代碼和上面的代碼效果是一樣的
<asp:datagrid runat=
server
BackColor=
Red
/>
我個人喜歡後一種方法
我發現在Web控件的標記中設定顯示屬性比在服務器端代碼中設定要簡潔
(請注意
對於服務器端代碼的方法
需要引入System
Drawing命名空間
才能通過Color
Red對顏色進行引用
對於在Web控件的標記中設定顯示屬性的方法
僅需寫上BackColor=
Red
我覺得後一種方法更可讀
)
讓我們看一下用於設定DataGrid格式的有用的屬性
l BackColor — 設定背景顏色
l Font — 設定DataGrid的字體信息
字體信息包括使用何種字體
字號
是否粗體
斜體等
l CellPadding — 設定HTML表格中單元格內的邊距
l CellSpacing — 設定HTML表格中單元格之間的間距
l Width — 設定HTML表格的寬度(可以以像素
百分比等為單位)
l HorizontalAlign — 設定表格在頁面上的對齊方式(左對齊
右對齊
居中
未設定)
一個使用上述屬性而使得表格變得漂亮的例子如下所示
請注意DataGrid的Font屬性是一個對象
它指向了FontInfo類
FontInfo類包括Size
Name
Bold
Italic等屬性
為了設定Font對象所指向類的屬性
必須通過連字符(
)完成
這類似於VB
Net和C#語言中表示對象屬性的點(
)
<asp:DataGrid runat=
server
id=
dgFAQs
BackColor=
#eeeeee
Width=
%
HorizontalAlign=
Center
Font
Bold=
True
Font
Name=
Verdana
Font
Size=
pt
/>
FAQID
Description
…
DateEntered
CatName
Where can I host my ASP Web site for free (similar to GeoCities or Tripod or any of the many other free Web site sites)?
/
/
:
:
AM
Getting Started
How can I format numbers and date/times using ASP
NET? For example
I want to format a number as a currency
/
/
:
:
PM
ASP
NET
…
Databases
Errors
是否印象深刻?通過幾行文本
我們改變了DataGrid的外觀
生成了一個居中
具有灰色和漂亮字體的HTML表格
通過樣式發揮你的想象力
DataGrid Web控件包含一些樣式
你將發現通過樣式改變DataGrid的外觀非常有效
這些樣式支持很多屬性
包括BackColor
ForeColor
HorizontalAlign和 Width
(參考文檔可獲得更多信息)
DataGrid包括四類樣式
l HeaderStyle — 設定頁眉的樣式
(頁眉指表格的最上面一行
它列出了每列的名稱
要顯示頁眉
需將DataGrid的ShowHeader屬性設為True(缺省為True) )
l FooterStyle —設定頁腳的樣式
(頁腳指表格的最下面一行
要顯示頁腳
需將DataGrid的ShowFooter屬性True(缺省為False))
l ItemStyle — 設定表格中每一行的樣式
l AlternatingItemStyle — 設定表格中交替行的樣式
通過將ItemStyle和AlternatingItemStyle設為不同的值使得DataGrid便於閱讀
(可參考下面的示例)
和設定DataGrid的格式類似
樣式可通過程序或DataGrid Web控件的標記進行設定
如上所述
我個人喜歡使用Web控件的標記並且將在示例中使用該方法
第一種方法與通過代碼設置DataGrid的格式類似
通過在對象後面加一個點
即如果想設定HeaderStyle的BackColor
可在代碼中通過HeaderStyle
BackColor=Color
Red實現
另一個方法是通過在Web 控件的標記中使用特別的樣式塊
如下所示
<asp:DataGrid runat=
server
>
<HeaderStyle BackColor=
Red
/>
</asp:DataGrid>
兩種方法均可行
我發現嵌入標記的方法便於閱讀
特別是當你需要為眾多樣式設定眾多屬性時
下面的示例顯示如何美化先前的示例
<asp:DataGrid runat=
server
id=
dgFAQs
BackColor=
#eeeeee
Width=
%
HorizontalAlign=
Center
Font
Name=
Verdana
Font
Size=
pt
>
<HeaderStyle BackColor=
Black
ForeColor=
White
Font
Bold=
True
HorizontalAlign=
Center
/>
<AlternatingItemStyle BackColor=
White
/>
</asp:datagrid>
示例運行結果如下
FAQID
Description
ViewCount
FAQCategoryID
DateEntered
Where can I host my ASP Web site for free (similar to GeoCities or Tripod or any of the many other free Web site sites)?
…
/
/
:
:
AM
How can I format numbers and date/times using ASP
NET? For example
I want to format a number as a currency
/
/
:
:
PM
I am using Access and getting a
error (or a [Microsoft][ODBC Microsoft Access Driver] The Microsoft Jet database engine cannot open the file
(unknown)
error) when trying to open a connection! How can I fix this problem?
/
/
:
:
PM
…
現在我們已經研究了如何使用樣式以及如何設定DataGrid控件的全局顯示屬性(格式)
下面還需要研究一個主題
如何對每一個特定列設定樣式和顯示屬性
我們將在本文第二部分討論這項技術
From:http://tw.wingwit.com/Article/program/ASP/201311/21818.html