ASP.NET中继器交替行高亮没有完整的<alternatingitemtemplate />
我试图完成简单地添加一个css类到我的<itemtemplate/>
交替行的div没有去包括一个完整的吹动<alternatingitemtemplate/>
这将迫使我保持了很多标记在同步未来。
我见过一个解决scheme,如http://blog.net-tutorials.com/2009/04/02/how-to-alternate-row-color-with-the-aspnet-repeater-control/我是试图使用,但这仍然没有“闻到”权利给我。
有没有其他人有一个更可维护和简单的解决scheme? 理想情况下,我希望能够做到这样的事情:
<asp:repeater id="repeaterOptions" runat="server"> <headertemplate> <div class="divtable"> <h2>Other Options</h2> </headertemplate> <itemtemplate> <div class="item <%# IsAlternatingRow ? "dark" : "light" %>">
但我不知道如何实现IsAlternatingRow
– 即使使用扩展方法。
没有必要pipe理自己的variables(增量计数器或布尔值); 你可以看到内置的ItemIndex
属性是否可以被二整除,并用它来设置一个css类:
class="<%# Container.ItemIndex % 2 == 0 ? "" : "alternate" %>"
这有利于完全基于您的UI代码(ascx或aspx文件),并且不依赖于JavaScript。
C#
class="<%# Container.ItemIndex % 2 == 0 ? "" : "alternate" %>"
VB
class="<%# iif(Container.ItemIndex Mod 2 = 0,"","alternate") %>"
这帮助了我
class='<%# Container.ItemIndex % 2 == 0 ? "" : "alternate" %>'
以前的答案导致“服务器标记不正确”错误。
使用JQuery来应用这些类。
$('.divtable > div:odd').addClass('dark'); $('.divtable > div:even').addClass('light');
你可以使用jQuery来代替。 对上一个问题的回答可能会有所帮助: jQuery Zebraselect器
小调整:空类可以删除像这样的东西:
<%# Container.ItemIndex % 2 == 0 ? "<tr>" : "<tr class='odd'>" %>
IsAlternatingRow可以是一个受保护的属性,将被设置在ItemDataBound或ItemCreated事件中。
protected void rpt_ItemDataBound(object sender, EventArgs e) { IsAlternatingRow = !IsAlternatingRow; }
不需要代码。 这是一个纯粹的CSS解决scheme:
.item:nth-child(odd){background-color: #ccc} .item:nth-child(){background-color: #ddd}