1. PROG11044 - Advanced Web Apps
2/24/2019
Session 9.2
Data Binding
Wendi Jollymore, ACES

2. Review Repeater control
A control that repeats a set of controls and/or formatting
You define what each row should look like
<ItemTemplate></ItemTemplate>
The control is bound to a data source
The template is repeated for each set of data
E.g. for each element of an array or hash table
2/24/2019
Wendi Jollymore, ACES

3. Review Repeater.DataSource property Repeater.DataBind() method
Contains the name of or reference to a data source
E.g. the name of a hash table, the name of an array variable, or the name of a DataSet object
Repeater.DataBind() method
Retrieves the data from the data source and re-populates the control with that data
DataSource and DataBind() are common to the various data-bound controls in ASP.NET
E.g. DataList, GridView, FormView, etc.
2/24/2019
Wendi Jollymore, ACES

4. Review Container.DataItem
Refers to a data item in the container (template, in this case)
Depends on the source of the data
E.g. if the source is an array of strings, then DataItem is a String
E.g. if the source is a hash table, then DataItem is one element of the hash table
2/24/2019
Wendi Jollymore, ACES

5. Review DictionaryEntry class
Models a piece of data with a key/value pair
Example: A hash table element
Key property that contains the key portion
Value property for value
2/24/2019
Wendi Jollymore, ACES

6. Review Container.DataItem from a hash table:
We need to get the element’s key and value
Cast Container.DataItem into a DictionaryEntry object
DictionaryEntry.Key
DictionaryEntry.Value
2/24/2019
Wendi Jollymore, ACES

7. Review Inline data binding expression: <%# … %> .Key or .Value
<%# ((DictionaryEntry)Container.DataItem).Key %>
<%# … %>
Special inline syntax for data binding expression
((DictionaryEntry)Container.DataItem)
Cast Container.DataItem into DictionaryEntry object
.Key or .Value
Reads the key or value property of the hash table element
2/24/2019
Wendi Jollymore, ACES

8. Repeater Templates ItemTemplate AlternatingItemTemplate
The template for each item in the repeater
You can put HTML, text, inline code, and other controls in here
AlternatingItemTemplate
You can make every other row look different
E.g. different background colour
2/24/2019
Wendi Jollymore, ACES

9. Repeater Templates HeaderTemplate FooterTemplate
The header!
What appears once at the top of the repeater
FooterTemplate
The footer!
What appears once at the bottom of the repeater
For more templates, see the DataList control
2/24/2019
Wendi Jollymore, ACES

10. Repeater Templates Try it out!
Make up a hash table with key/value data
E.g. myData[“prog10082”] = “OOP 1”;
Create a repeater control
Header  open table tags and header row of table
Footer  add footer row and closing table tags
Continued…
2/24/2019
Wendi Jollymore, ACES

11. Repeater Templates ItemTemplate:
Opening and closing <tr></tr> tags
Two sets of <td></td> tags
First cell for key
Second cell for value
<ItemTemplate><tr><td>…</td>
<td>…</td></tr></ItemTemplate>
2/24/2019
Wendi Jollymore, ACES

12. Repeater Templates AlternatingItemTemplate Just like ItemTemplate
Add to <tr>:
bgcolor=“silver”
Or whatever colour you like
Everything else is the same
2/24/2019
Wendi Jollymore, ACES

13. Repeater Templates
Data binding expression to go inside first set of <td></td>:
<%# ((DictionaryEntry)Container.
DataItem).Key %>
Data binding expression to go inside second set of <td></td>:
DataItem).Value %>
2/24/2019
Wendi Jollymore, ACES

14. Don’t forget to add using System.Collections;
Binding the Repeater
Page Load event:
If this is not a postback, do these things:
Create your hash table (just hard-code it)
Assign your hash table object variable to the repeater’s DataSource
Invoke repeater’s DataBind()
Don’t forget to add using System.Collections;
2/24/2019
Wendi Jollymore, ACES

15. Binding to XML Data Make up an XML File: <bookmarks>
<siteName></siteName>
<url></url>
</bookmark> …
</bookmarks>
Add new XML to project.
Fill in data with whatever sites you want.
2/24/2019
Wendi Jollymore, ACES

16. DataSets System.Data.DataSet class
A cool way to store data in rows and columns
DataSet.ReadXml(“xmlFile.xml”)
Reads in a valid XML file
Stores XML data in a table
Will use the XML element names as column names
Each <bookmark></bookmark> node will be one record
2/24/2019
Wendi Jollymore, ACES

17. DataSets from XML Files
The data is stored in rows or records
The XML element names become the column/field names
siteName
url
“Terminal Learning”
“Pogo”
“Bookcrossing”
2/24/2019
Wendi Jollymore, ACES

18. DataSets from XML Files
Make a new project:
Add a repeater control and set up a header and item template
Header should say “Bookmarks” and formatted however you like
Item template contains a single hyperlink server control
The link will be an actual link to each bookmark entry in your XML file
2/24/2019
Wendi Jollymore, ACES

19. Data Binding Expression
Eval() method
An alternate way of data binding
Much more efficient
Great to use if you have field names!
<%# Eval(“[fieldName]”) %>
If you know the name of the data field
For the hyperlink control:
Add attribute
NavigateUrl=‘<%# Eval(“[url]”) %>’
Text between tags:
<%# Eval(“[siteName]”) %>
2/24/2019
Wendi Jollymore, ACES

20. DataSets from XML Files
Code:
Using System.Data;
Page Load:
All this is done if this is not a postback
Create a new DataSet object
Read the XML file into the data set
DataSet myData = new DataSet();
myData.ReadXml(MapPath(“bookmarks.xml”));
MapPath() just makes sure you’re using the application path
2/24/2019
Wendi Jollymore, ACES

21. DataSets from XML Files
Page Load, continued
Assign the data set object to the repeater’s DataSource
Invoke repeater’s DataBind
Try loading the page…
2/24/2019
Wendi Jollymore, ACES

22. Exercise Do the Data Binding tutorial in the notes
Very similar to previous two exercises
Adds some functionality with check boxes!
Note the little blue box about formatting!
That’s a hint for Assign 1
2/24/2019
Wendi Jollymore, ACES