Displaying A Credit Card Bill with a Summary

This live demo shows how to display a credit-card bill using a DataGrid showing the sum of the Price BoundColumn in the Footer.


DescriptionDatePrice
AMAZON.COM5/15/2003$45.14
MOBILE GAS5/14/2003$25.08
VONS GROCERY STORE5/14/2003$67.23
BLOCKBUSTER ENTERTAINMENT5/15/2003$4.63
PIER 21 FURNITURE5/16/2003$187.11
  Total: $329.19


Source Code

<%@ Page Language="VB" %>
<%@ Import Namespace="System.Data" %>
<script runat="server">

    Sub Page_Load(sender as Object, e as EventArgs)
         If Not Page.IsPostBack then
             BindData()
         End If
    End Sub
    
    
    Sub BindData()
		'Create the DataTable
		Dim dtTable as New DataTable
		dtTable.Columns.Add(New DataColumn(("Description"), GetType(String)))
		dtTable.Columns.Add(New DataColumn(("DatePurchased"), GetType(DateTime)))
		dtTable.Columns.Add(New DataColumn(("Price"), GetType(Single)))
		
		'Create some Rows
		Dim dr as DataRow
		dr = dtTable.NewRow()
		dr("Description") = "AMAZON.COM"
		dr("DatePurchased") = "05/15/2003"
		dr("Price") = 45.14
		dtTable.Rows.Add(dr)
		
		dr = dtTable.NewRow()
		dr("Description") = "MOBILE GAS"
		dr("DatePurchased") = "05/14/2003"
		dr("Price") = 25.08
		dtTable.Rows.Add(dr)

		dr = dtTable.NewRow()
		dr("Description") = "VONS GROCERY STORE"
		dr("DatePurchased") = "05/14/2003"
		dr("Price") = 67.23
		dtTable.Rows.Add(dr)

		dr = dtTable.NewRow()
		dr("Description") = "BLOCKBUSTER ENTERTAINMENT"
		dr("DatePurchased") = "05/15/2003"
		dr("Price") = 4.63
		dtTable.Rows.Add(dr)

		dr = dtTable.NewRow()
		dr("Description") = "PIER 21 FURNITURE"
		dr("DatePurchased") = "05/16/2003"
		dr("Price") = 187.11
		dtTable.Rows.Add(dr)


		'Now, bind the DataView to the DataGrid
		dgBill.DataSource = dtTable
		dgBill.DataBind()
	End Sub
	
	Dim runningSum as Single = 0.0
    Sub KeepRunningSum(sender As Object, e As DataGridItemEventArgs)        
        If e.Item.ItemType = ListItemType.Item OR _
           e.Item.ItemType = ListItemType.AlternatingItem then
             runningSum += Convert.ToSingle(DataBinder.Eval(e.Item.DataItem, "Price"))
        ElseIf e.Item.ItemType = ListItemType.Footer then
          e.Item.Cells(2).Text = "<b>Total:</b> " & String.Format("{0:c}", runningSum)
        End If
    End Sub
</script>

<asp:DataGrid runat="server" id="dgBill" AutoGenerateColumns="False"
             Font-Name="Verdana" Font-Size="10pt" CellPadding="4"
             AlternatingItemStyle-BackColor="#eeeeee"
             OnItemDataBound="KeepRunningSum"
             ShowFooter="True">
      
      <HeaderStyle BackColor="Navy" ForeColor="White"
            Font-Size="14pt" Font-Bold="True" HorizontalAlign="Center" />
      <FooterStyle BackColor="#CCCCCC" />
            
      <Columns>
        <asp:BoundColumn DataField="Description" HeaderText="Description" />
        <asp:BoundColumn DataField="DatePurchased" HeaderText="Date" 
                 DataFormatString="{0:d}" />
        <asp:BoundColumn DataField="Price" HeaderText="Price"
                 DataFormatString="{0:c}"
                 ItemStyle-HorizontalAlign="Right" />
      </Columns>
</asp:DataGrid>
    

[Return to the FAQ...]