Шаблон повторителя ASP.NET, условный код для каждого N-го элемента - PullRequest
Новая
       26

Шаблон повторителя ASP.NET, условный код для каждого N-го элемента

13 голосов
/ 18 февраля 2009

Я использую ретранслятор asp.net для создания набора изображений. Разметка изображения все та же, поэтому стандарт <ItemTemplate> в порядке.

Однако я хочу обернуть K изображений в div. Допустим, я связываю более 25 изображений с ретранслятором и хочу 5 изображений на деление. Как я могу условно создать теги start и close для div?

Этот случай лучше подходит для цикла for.

Ответы [ 4 ]

23 голосов
/ 18 февраля 2009

Это должно работать для вас, без необходимости в коде (кроме привязки повторителя ..): 

<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>
10 голосов
/ 14 мая 2009

Вот где Asp.Net WebForms может дать вам невероятную эффективность RAD. Вы можете использовать новый элемент управления ListView и установить количество элементов в «группе», что позволит вам настроить HTML-код, окружающий группу, а также каждый отдельный элемент. Таким образом, вы можете окружить группу условными тегами. 

<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>
3 голосов
/ 18 февраля 2009

Если вы хотите сохранить свою разметку на странице ASPX, вы также можете попробовать этот вариант метода Дэвида:

На странице aspx: 

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

В событии ItemDataBound в коде: 

e.Item.FindControl("divStart").Visible
    = e.Item.FindControl("divEnd").Visible 
    = e.Item.ItemIndex % 5 == 0;
2 голосов
/ 18 февраля 2009

Добавьте два пустых элемента управления надписью в шаблон Repeaters ItemTemplate, где вы хотите разместить теги div.

Затем добавьте событие ItemDataBound в повторитель.

Затем добавьте этот код в событие ItemDataBound: 

    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

Примечание. Для обработки первого элемента div потребуется некоторая настройка, и вам может потребоваться сделать что-то вроде If (e.Item.ItemIndex + 1) Mod 5 = 0 , чтобы элементы div отображались именно там, где вы хотите их.

Для получения дополнительной информации:
Свойство DataListItem.ItemIndex
Событие DataList.ItemDataBound

...