Nested Repeaters in ASP.NET

Introduction

Never really been much of a web-developer and never thought I'd find web-development all that interesting. But I must say I've been quite fascinated by what little ASP.NET I've done up till now, which is not a lot to be honest. One control I found particularly useful was the Repeater control, but I struggled a little when I tried to implement nested repeaters using an XML file as the data store. Eventually, the solution turned out to be embarrassingly easy, and I thought I'd write a little article for other first-timers who might encounter the same annoying situation I did.

Here I am going to demonstrate a simple ASP.NET web application that will list out a Cricket World XI using an XML file as the input-data. Eventually, modification of the team simply involves a change in the XML file with no changes required either in the aspx pages or in the code-behind files.

XML File Used



Implementing nested repeaters

<asp:Repeater id="CategoryRepeater" runat="server">
<HeaderTemplate>
	<h2>World XI</h2>
	<ul>
</HeaderTemplate>
<FooterTemplate>
	</ul>
</FooterTemplate>
</asp:Repeater>
			

We now add the inner repeater to the <ItemTemplate> tag of the outter repeater.

<ItemTemplate>
	<li><b><%# DataBinder.Eval(Container.DataItem, "type") %></b></li>
	<asp:Repeater id="PlayerRepeater" runat="server">
	<HeaderTemplate>
		<ul>
	</HeaderTemplate>
	<FooterTemplate>
		</ul>
	</FooterTemplate>
	<ItemTemplate>
	<li><%# DataBinder.Eval(Container.DataItem, "cricketer_Text") %></li>
	</ItemTemplate>
	</asp:Repeater>
</ItemTemplate>

			

code-behind code

Alright, I know that "code-behind code" sounds weird, but I couldn't think of anything better sounding and if anyone has any better ideas, please drop me a line. Anyway we setup the first repeater in the Page_Load event handler as usual.

			
private void Page_Load(object sender, System.EventArgs e)
{
    DataSet ds = new DataSet();
    ds.ReadXml(MapPath("samplefile.xml"));
    CategoryRepeater.DataSource = ds;
    CategoryRepeater.DataBind();
}

For setting up the outter repeater, we handle the ItemDataBound event of the Repeater class which is raised when an item is data-bound but before it is rendered on the page. We now get a reference to the PlayerRepeater control using RepeaterItem.FindControl and set its data source using CreateChildView and the automatic relation that's made for us - category_cricketer. By the way I was quite impressed by that, I never expected automatic relations to be created based on the XML.

private void CategoryRepeater_ItemDataBound(object sender, 
    System.Web.UI.WebControls.RepeaterItemEventArgs e)
{
    RepeaterItem item = e.Item;
    if( (item.ItemType == ListItemType.Item) ||
        (item.ItemType == ListItemType.AlternatingItem) )
    {
        PlayerRepeater = (Repeater) item.FindControl("PlayerRepeater");
        DataRowView drv = (DataRowView)item.DataItem;
        PlayerRepeater.DataSource = drv.CreateChildView("category_cricketer");
        PlayerRepeater.DataBind();
    }
}

OutPut