Formatting the Repeater

for RuBoard

Formatting the `Repeater`

Most of the formatting that can be performed by the Repeater list control is done within the various templates supported by the control. In other words, the formatted output of the Repeater is only as good as your skills in HTML, because you design and implement these templates yourself. Nonetheless, by using the provided template types along with some smart CSS, you can achieve some good-looking results easily.

In the preceding hour , we took a look at formatting the Repeater output using the ItemTemplate . As you recall, this enabled us to insert data fields returned from our data source into some static HTML content. In addition to the ItemTemplate , the Repeater also supports a HeaderTemplate , FooterTemplate , AlternatingItemTemplate , and a SeparatorTemplate . Most of these template types are self-explanatory.

Listing 12.4 shows an example using all the provided templates. The AlternatingItemTemplate applies a grey background to every other item bound. The HeaderTemplate and FooterTemplate add headers and footers to the control, and the SeparatorTemplate ensures that there is a new line after each item is bound. Figure 12.4 shows how the Repeater example in Listing 12.4 appears when run.

Figure 12.4. The appearance of the example in Listing 12.4.

graphics/12fig04.jpg

Listing 12.4 Using the Various `Repeater` Templates

 <% @Page Language="VB" %> <%@ Import Namespace="System.Data" %> <%@ Import Namespace="System.Data.SqlClient" %> <HTML> <HEAD>     <LINK rel="stylesheet" type="text/css" href="Main.css">     <!-- End Style Sheet -->     <script language="VB" runat="server" >         Sub Page_Load(Source as Object, E as EventArgs)             LoadGridData( categories )         End Sub         Private Sub LoadGridData( _                             myDataList as System.Web.UI.WebControls.Repeater )            Dim conn as New SqlConnection("Initial Catalog=Northwind;" + _                                        "Server=(local);UID=sa;PWD=;")            Dim cmd as New SqlCommand("Exec Categories_Get ", conn)            conn.Open()            myDataList.DataSource = cmd.ExecuteReader()            myDataList.DataBind()            conn.Close()         End Sub     </script> </HEAD> <BODY> <form runat="server"> <asp:repeater id="categories" runat="server">     <HeaderTemplate>         <h1>Product Categories!</h1>     </HeaderTemplate>     <ItemTemplate>         <span>         <a href='products.aspx?CategoryID= <%# DataBinder.Eval(Container.DataItem,  "CategoryID") %>'>             <%# DataBinder.Eval(Container.DataItem, "CategoryName") %>         </a>         </span>     </ItemTemplate>     <SeparatorTemplate>         <br>     </SeparatorTemplate>     <AlternatingItemTemplate>         <span style="background-color: #CCCCCC;">         <a href='products.aspx?CategoryID= <%# DataBinder.Eval(Container.DataItem,  "CategoryID") %>'>             <%# DataBinder.Eval(Container.DataItem, "CategoryName") %>         </a>         </span>     </AlternatingItemTemplate>     <FooterTemplate>         <br><font size="-2">         Copyright 2002 Your Company</font>     </FooterTemplate> </asp:repeater> </form> <hr> </BODY> </HTML>

for RuBoard