Build Your Own ASP.NET 2.0 Web Site Using C# & VB, Second Edition

Choosing the Property Builder from the smart tag’s menu displays a window that

lets us set various properties of a DataList. We can access the same settings

through the Properties window, but with the DataList we have another way to

set these properties.

The Choose Data Source item in the smart tag’s menu lets us choose a data source

control for our list. You’ll learn a lot more about this in Chapter 12.

Styling the DataList

The Auto Format item in the smart tag menu is probably the most interesting. I

left this discussion until the end of the chapter to give you the chance to play

with it a little beforehand. When you select Auto Format, a dialog with a number

of predefined setups will appear; you can customize these options manually to

suit your tastes, as Figure 10.10 illustrates.

Figure 10.10. Choosing an Auto Format option

If you choose the Simple style, then remove the SeparatorTemplate from your

DataList, your Employee Directory page will look like the one shown in Fig-

ure 10.11.

You may ask what happened behind the scenes. If you look at the DataList

definition in EmployeeDirectory.aspx, you’ll see it contains a few new lines

that Visual Web Developer generated for us after we chose the style:

</EditItemTemplate>

<FooterStyle BackColor="#1C5E55" Font-Bold="True"

ForeColor="White" />

424

Chapter 10: Displaying Content Using Data Lists

Figure 10.11. The styled Employee Directory list

<SelectedItemStyle BackColor="#C5BBAF" Font-Bold="True"

ForeColor="#333333" />

<AlternatingItemStyle BackColor="White" />

<ItemStyle BackColor="#E3EAEB" />

<HeaderStyle BackColor="#1C5E55" Font-Bold="True"

ForeColor="White" />

</asp:DataList>

The significance of these new elements is as follows:

HeaderStyle

customizes the appearance of the DataList’s heading

ItemStyle

customizes the appearance of each item displayed within the DataList

AlternatingItemStyle

customizes the appearance of every other item displayed within the DataList

425

Styling the DataList