ASP.NET Repeater Template, Conditional Code for every Nth element

Question

I\'m using an asp.net repeater to create a bunch of images. The image markup is all the same so the standard is fine.

However, I want

Answer 1

If you want to keep your markup on the ASPX page you could also try this variation on David's method:

On the aspx page:

<ItemTemplate>
<asp:Literal runat="server" ID="divStart" Text="<div>" />
<asp:Image ....>
<asp:Literal runat="server" ID="divEnd" Text="</div>" />
</ItemTemplate>

In the ItemDataBound event in the codebehind:

e.Item.FindControl("divStart").Visible
    = e.Item.FindControl("divEnd").Visible 
    = e.Item.ItemIndex % 5 == 0;

Answer 2

Add two empty label controls into your Repeaters ItemTemplate where you'd want your div tags to be.

Then add an ItemDataBound event to the Repeater.

Then add this code into the ItemDataBound event:

    Protected Sub Repeater1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.RepeaterItemEventArgs)
    If (e.Item.ItemType = ListItemType.Item) Or (e.Item.ItemType = ListItemType.AlternatingItem) Then
        If e.Item.ItemIndex Mod 5 = 0 Then
            Dim lblDivStart As Label = CType(e.Item.FindControl("lblDivStart"), Label)
            Dim lblDivEnd As Label = CType(e.Item.FindControl("lblDivEnd"), Label)
            lblDivStart.text = "<div>"
            lblDivEnd.text = "</div>"
        End If
    End If
End Sub

Note - This will need some tweaking to handle the first div and you may need to do something like If (e.Item.ItemIndex + 1) Mod 5 = 0 to get the divs to show up exactly where you want them.

For more info:
DataListItem.ItemIndex Property
DataList.ItemDataBound Event

Answer 3

Here is where Asp.Net WebForms can give you incredible RAD efficiency. You can use the new ListView control, and set the number of items per "group", which will allow you to setup the HTML that surrounds a group, as well as each individual item. This way you can surround the group with the conditional tags.

<asp:ListView ID="ListView1" runat="server" DataKeyNames="id" DataSourceID="LinqDataSource1" GroupItemCount="3">
<LayoutTemplate>
    <div id="layout">
        <asp:PlaceHolder ID="groupPlaceholder" runat="server"></asp:PlaceHolder>
    </div>
</LayoutTemplate>
<GroupTemplate>
    <div class="group">
        <asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
    </div>
</GroupTemplate>
<EmptyDataTemplate>
    <span>No data was returned.</span>
</EmptyDataTemplate>
<ItemTemplate>
    <div class="item">
        <img alt='<%# Eval("title") %>' title='<%# Eval("title") %>'
            src='<%# Eval("filename","photos/{0}") %>' />
    </div>
</ItemTemplate>
</asp:ListView>

Answer 4

This should work for you, with no need for anything in the code behind (other than binding the repeater..):

<asp:Repeater ID="repImages" runat="server">
<HeaderTemplate><div></HeaderTemplate>

<ItemTemplate>
<%# (Container.ItemIndex != 0 && Container.ItemIndex % 5 == 0) ? @"</div><div>" : string.Empty %>
<asp:Image ID="imgGallery" runat="server" ImageUrl='<%# /* your code  here */ %>' />
</ItemTemplate>

<FooterTemplate></div></FooterTemplate>
</asp:Repeater>