How can I prevent duplication of the content in itemtamplate for the alternating template in repeater?

Question

Is there a way to prevent duplication ot an itemtemplate content which will just appear with a different css class for the alternating template block?

<asp:Repeater ID="rptCommentHistory" runat="server">
    <ItemTemplate>
        <asp:Label ID="lblComment" runat="server" Text='<%#Eval("Comment").ToString() %>' 
          Class="itemTemplate"/>
     </ItemTemplate>

    <AlternatingItemTemplate>
       <asp:Label ID="lblComment" runat="server" Text='<%#Eval("Comment").ToString() %>' 
          Class="alternatingTtemTemplate"/>
    </AlternatingItemTemplate>
</asp:Repeater>

score 4 · Answer 1 · answered Oct 24 '11 at 10:35

This should do what you want:-)

<asp:Repeater ID="rptData" runat="server">
    <ItemTemplate>
        <asp:Label ID="lblData" runat="server" Text='<%# Eval("Comments") %>' CssClass='<%# Container.ItemIndex%2==0?"itemTemplate":"alternatingTtemTemplate" %>'></asp:Label>
    </ItemTemplate>
    </asp:Repeater>

score 2 · Answer 2 · edited Oct 24 '11 at 11:22

I never make use of the AlternatingItemTemplate. I don't like having to duplicate my code for the purpose of having an alternating item, and I think that if the code is that different that it cannot be classed as a duplicate, then you shouldn't be using a Repeater control anyway.

Therefore I always just use the ItemTemplate, and make any changes I need to in the ItemDataBound event.

To determine whether the item is a normal, or alternating item, I would do something like:

if ((e.Item.ItemIndex+1 % 2)=0){
   //Alternating code here..
}

In your case the only difference is a change to the Label CssClass, so I would do something like:

if ((e.Item.ItemIndex+1 % 2)=0){
   Label lblComment = e.Item.FindControl("lblComment");
   lblComment.CssClass = "alternatingTtemTemplate";
}

score 0 · Answer 3 · answered Oct 24 '11 at 10:15

0

It's not really duplication as such, don't worry about it. You are implementing this pretty much as intended.

The only other option I can think of would be to use the itemtemplate, write some code that is fired on the itemdatabound event and programatically change the css class using FindControl.

I know which I would rather use...

answered Oct 24 '11 at 10:15

ChrisBint

12,773
6
40
62

1

Actually i worry as it does not make sense to me to see the same block just with a different css-class. There should be a simpler way which can be handeld only by editind the mark-up... Shouldn't it? – pencilCake Oct 24 '11 at 10:18
In your scenario, it is just a simple CSS change. In others, it may well be a lot different with additional controls, text and css. As said, you are implementing this as intended even if it does seem like a lot of the information is duplicated. – ChrisBint Oct 24 '11 at 10:23
@pencilCake Using `AlternatingTemplate` can be a quick recipe for disaster as you show, esp when templates gets larger and still mostly equal. It's a strong violation of [DRY](http://en.wikipedia.org/wiki/Don%27t_repeat_yourself). One common solution is to use a wrapper control (then you only have to repeat the declaration), another is to `ItemIndex` in the code-behind. Both have their merits, both avoid dangerous traps like this one. – Abel Oct 24 '11 at 10:57

score 0 · Answer 4 · answered Oct 24 '11 at 12:13

As it seems that the proposed solutions are not satisfying and that there are no other ".net" solution, I would suggest that you do that in javascript (as it doesn't exist in pure CSS).

jQuery allows you to apply a different style on even and odds elements of the selector. It should work with other elements than table rows...

So something like this should work :

$("#rptCommentHistory span:even").addClass("itemTemplate");
$("#rptCommentHistory span:odd").addClass("alternatingTtemTemplate");

Or you can just set ItemTemplate to all elements and use (it may perform better) :

$("#rptCommentHistory span:odd").removeClass("ItemTemplate").addClass("alternatingTtemTemplate");

How can I prevent duplication of the content in itemtamplate for the alternating template in repeater?

4 Answers4