模板
教程
環境
性能
功能
管理
輸出數據的潤飾
我們在呈現數據的時候，要特別注意使用者接口的設計。一個好的使用者接口，除了美觀外還可以讓使用者容易使用以及閱讀數據。
數據格式的潤飾
我們在呈現數據的時候，不要將未經修飾過的數據呈現給使用者。例如金額一萬元，如果我們直接顯示「10000」，可能會導致使用者看成一千或十萬，造成使用者閱讀數據上的困擾。若我們將一萬元潤飾后輸出為「NT$10,000」，不但讓使比較好閱讀，也會讓使用者減少犯錯的機會。下列畫面為潤飾過的結果：
上述數據除了將DataGrid Web 控件以顏色來區隔記錄外，最主要將日期、單價以及小計這三個計字段的數據修飾的更容易閱讀。要修飾字段的輸出，只要設定字段的DataFormatString 屬性即可；其使用語法如下：
DataFormatString="{0:格式字符串}"
我們知道在DataFormatString 中的{0} 表示數據本身，而在冒號后面的格式字符串代表所們希望數據顯示的格式；另外在指定的格式符號后可以指定小數所要顯示的位數。例如原來的數據為「12.34」，若格式設定為{0:N1}，則輸出為「12.3」。其常用的數值格式如下表所示：
其常用的日期格式如下表所示：
上述畫面完整程序如下所示：
<%@Import Namespace=System.Data%>
<%@Import Namespace=System.Data.ADO%>
<html>
<Form Runat="Server">
<ASP:DataGrid Id="dgA" AllowPaging="True" PageSize="5"
OnPageIndexChanged="dgA_PageChg"
Runat="Server"
PagerStyle-Mode="NumericPages"
BorderColor="#808080"
HeaderStyle-Font-Names="Courier New"
HeaderStyle-BackColor="#D1DCEB"
HeaderStyle-Font-Bold="True"
HeaderStyle-HorizontalAlign="Center"
AutoGenerateColumns="False"
OnItemCommand="dgA_ICmd"
Alternatingitemstyle-BackColor="#ffff99">
<Property Name="PagerStyle">
<ASP:DataGridPagerStyle
HorizontalAlign="Center" BackColor="Gainsboro"
PageButtonCount="4" Mode="NumericPages"/></Property>
<Property Name="AlternatingItemStyle">
<ASP:TableItemStyle ForeColor="Black"
BackColor="Gainsboro"/></Property>
<Property Name="ItemStyle">
<ASP:TableItemStyle ForeColor="#000040"/></Property>
<Property Name="HeaderStyle">
<ASP:TableItemStyle Font-Names="Courier New" Font-Bold="True"
HorizontalAlign="Center" BackColor="#D1DCEB"/></Property>
<Property Name="Columns">
<ASP:ButtonColumn DataTextField="UserName" HeaderText="姓名"/>
<ASP:BoundColumn DataField="UserTel" HeaderText="電話"/>
<ASP:BoundColumn DataField="UserAdd" HeaderText="住址"/>
<ASP:BoundColumn DataField="UserEmail" HeaderText="電郵"/>
</Property>
</ASP:DataGrid><p>
<ASP:DataGrid Id="dgB" Runat="Server"
PagerStyle-Mode="NumericPages"
BorderColor="#808080"
HeaderStyle-Font-Names="Courier New"
HeaderStyle-BackColor="#D1DCEB"
HeaderStyle-Font-Bold="True"
HeaderStyle-HorizontalAlign="Center"
AutoGenerateColumns="False"
backcolor="Transparent" >
<Property Name="PagerStyle">
<ASP:DataGridPagerStyle Mode="NumericPages"/></Property>
<Property Name="AlternatingItemStyle">
<ASP:TableItemStyle ForeColor="Black"
BackColor="Gainsboro"/></Property>
<Property Name="ItemStyle">
<ASP:TableItemStyle ForeColor="#000040"
BackColor="White"/></Property>
<Property Name="HeaderStyle">
<ASP:TableItemStyle Font-Names="新細明體" Font-Bold="True"
HorizontalAlign="Center" BackColor="#D1DCEB"/></Property>
<Property Name="Columns">
<ASP:BoundColumn DataField="OrderDate" HeaderText="日期"
DataFormatString="{0:d}"/>
<ASP:BoundColumn DataField="ProductName" HeaderText="產品名稱"/>
<ASP:BoundColumn DataField="UnitPrice" HeaderText="單價"
DataFormatString="NT${0:N0}"/>
<ASP:BoundColumn DataField="Quantity" HeaderText="數量"/>
<ASP:BoundColumn DataField="Total" HeaderText="小計"
DataFormatString="NT${0:N0}"/>
</Property>
</ASP:DataGrid>
</Form>
<ASP:Label Id="Label1" Runat="Server"/>
<Script Language="VB" Runat="Server">
Dim dscA As ADODataSetCommand=New ADODataSetCommand("Select * From
Members", _
"Provider=Microsoft.Jet.OLEDB.4.0;Data
Source=C:\InetPub\wwwroot\CR\Ch08\MyWeb.Mdb")
Dim dsDataSet As DataSet=New DataSet
Sub Page_Load(Sender As Object, e As EventArgs)
If Page.IsPostBack=False Then
dscA.SelectCommand.CommandText="Select * From Members"
dscA.FillDataSet(dsDataSet, "Members")
dgA.DataSource=dsDataSet.Tables("Members").DefaultView
dgA.DataBind()
End If
Label1.Text="您目前沒有點選任何記錄."
End Sub
Sub dgA_PageChg(Sender As Object, e As DataGridPageChangedEventArgs)
dscA.FillDataSet(dsDataSet, "Members")
dgA.DataSource=dsDataSet.Tables("Members").DefaultView
dgA.DataBind()
dgB.Visible=False
End Sub
Sub dgA_ICmd(Sender As Object, e As DataGridCommandEventArgs)
Dim shtR As Short=(dgA.CurrentPageIndex * dgA.PageSize) +
e.Item.ItemIndex
If shtR>=0 Then
dscA.FillDataSet(dsDataSet, "Members")
dscA.SelectCommand.CommandText="Select * From Orders Where
UserId='" & _
dsDataSet.Tables("Members").Rows(shtR)("UserId") & "'"
dscA.FillDataSet(dsDataSet, "Orders")
dgB.DataSource=dsDataSet.Tables("Orders").DefaultView
dgB.DataBind()
dgB.Visible=True
Label1.Text="總共有" & dsDataSet.Tables("Orders").Rows.Count & "
筆記錄"
End If
End Sub
</SCRIPT>
</html>
