css - 当我添加转发器时，ASP.net Webforms runat 服务器调用不起作用

Question

我正在创建一个时间轴，时间轴有一个在屏幕中心向下延伸的条，第一篇文章在左边，第二篇在右边等等。

对于静态文本，我可以使用以下调用来确定要使用的 css block :

<li id ="li_left" runat ="server" >
            <div class="timeline-datetime">
                <span class="timeline-time">8:19
                </span><span class="timeline-date">Today</span>
            </div>
            <div class="timeline-badge blue">
                <i class="fa fa-tag"></i>
            </div>
            <div class="timeline-panel">
                <div class="timeline-header bordered-bottom bordered-blue">
                    <span class="timeline-title">New Items Arrived
                    </span>
                    <p class="timeline-datetime">
                        <small class="text-muted">
                            <i class="glyphicon glyphicon-time"></i>
                            <span class="timeline-date">Today</span>
                            -
                                            <span class="timeline-time">8:19</span>
                        </small>
                    </p>
                </div>
                <div class="timeline-body">
                    <p>My Post Message</p>
                </div>
            </div>
        </li>

然后在我后面的代码中使用这个:

    Private Sub li_left_Load(sender As Object, e As EventArgs) Handles li_left.Load
    If IsEven(postCount) = True Then
        li_left.Style.Add("display", "visible")
        postCount += 1
    Else
        li_left.Style.Add("display", "none")
    End If
End Sub

完整前端代码:

<ul class="timeline">
    <li class="timeline-node">
        <a class="btn btn-palegreen">NOW</a>
    </li>
   <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
        <ItemTemplate>

    <li id ="li_left" runat ="server" >
        <div class="timeline-datetime">
            <span class="timeline-time">8:19
            </span><span class="timeline-date">Today</span>
        </div>
        <div class="timeline-badge blue">
            <i class="fa fa-tag"></i>
        </div>
        <div class="timeline-panel">
            <div class="timeline-header bordered-bottom bordered-blue">
                <span class="timeline-title">New Items Arrived
                </span>
                <p class="timeline-datetime">
                    <small class="text-muted">
                        <i class="glyphicon glyphicon-time"></i>
                        <span class="timeline-date">Today</span>
                        -
                                        <span class="timeline-time">8:19</span>
                    </small>
                </p>
            </div>
            <div class="timeline-body">
                <p>My Left Post Message</p>
            </div>
        </div>
    </li>
    <li class="timeline-inverted" id="li_right" runat ="server"  >
        <div class="timeline-datetime">
            <span class="timeline-time">3:10
            </span><span class="timeline-date">Today</span>
        </div>
        <div class="timeline-badge darkorange">
            <i class="fa fa-map-marker font-120"></i>
        </div>
        <div class="timeline-panel bordered-right-3 bordered-orange">
            <div class="timeline-header bordered-bottom bordered-blue">
                <span class="timeline-title">Visit Appointment
                </span>
                <p class="timeline-datetime">
                    <small class="text-muted">
                        <i class="glyphicon glyphicon-time"></i>
                        <span class="timeline-date">Today</span>
                        -
                                        <span class="timeline-time">3:10</span>
                    </small>
                </p>
            </div>
            <div class="timeline-body">
                <p>My Right Post Message</p>
                <p>
                    <i class="orange fa fa-exclamation"></i>New task added for <span><a href="#" class="info">James Dean</a></span>
                </p>
            </div>
        </div>
    </li>


    <li class="timeline-node">
        <a class="btn btn-yellow">YESTERDAY</a>
    </li>
    <li class="timeline-node">
        <a class="btn btn-info">11 DECEMBER</a>
    </li>
         </ItemTemplate>
    </asp:Repeater>
</ul>

以及控制使用哪个 css black 的代码:

     Dim postCount As Integer = 0

Private Sub li_left_Load(sender As Object, e As EventArgs) Handles li_left.Load
    If IsEven(postCount) = True Then
        li_left.Style.Add("display", "visible")
        postCount += 1
    Else
        li_left.Style.Add("display", "none")
    End If
End Sub

Private Sub li_right_Load(sender As Object, e As EventArgs) Handles li_right.Load
    If IsEven(postCount) = True Then
        li_right.Style.Add("display", "none")
    Else
        li_right.Style.Add("display", "visible")
        postCount += 1
    End If
End Sub

不，我在所有东西中添加中继器的那一秒就坏了，我不明白为什么。

添加了转发器的代码:

    <ul class="timeline">
    <li class="timeline-node">
        <a class="btn btn-palegreen">NOW</a>
    </li>
   <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
        <ItemTemplate>

    <li id ="li_left" runat ="server" >
        <div class="timeline-datetime">
            <span class="timeline-time">8:19
            </span><span class="timeline-date">Today</span>
        </div>
        <div class="timeline-badge blue">
            <i class="fa fa-tag"></i>
        </div>
        <div class="timeline-panel">
            <div class="timeline-header bordered-bottom bordered-blue">
                <span class="timeline-title">New Items Arrived
                </span>
                <p class="timeline-datetime">
                    <small class="text-muted">
                        <i class="glyphicon glyphicon-time"></i>
                        <span class="timeline-date">Today</span>
                        -
                                        <span class="timeline-time">8:19</span>
                    </small>
                </p>
            </div>
            <div class="timeline-body">
                <p><%# DataBinder.Eval(Container.DataItem, "message") %></p>
            </div>
        </div>
    </li>
    <li class="timeline-inverted" id="li_right" runat ="server"  >
        <div class="timeline-datetime">
            <span class="timeline-time">3:10
            </span><span class="timeline-date">Today</span>
        </div>
        <div class="timeline-badge darkorange">
            <i class="fa fa-map-marker font-120"></i>
        </div>
        <div class="timeline-panel bordered-right-3 bordered-orange">
            <div class="timeline-header bordered-bottom bordered-blue">
                <span class="timeline-title">Visit Appointment
                </span>
                <p class="timeline-datetime">
                    <small class="text-muted">
                        <i class="glyphicon glyphicon-time"></i>
                        <span class="timeline-date">Today</span>
                        -
                                        <span class="timeline-time">3:10</span>
                    </small>
                </p>
            </div>
            <div class="timeline-body">
                <p><%# DataBinder.Eval(Container.DataItem, "message") %></p>
                <p>
                    <i class="orange fa fa-exclamation"></i>New task added for <span><a href="#" class="info">James Dean</a></span>
                </p>
            </div>
        </div>
    </li>


    <li class="timeline-node">
        <a class="btn btn-yellow">YESTERDAY</a>
    </li>
    <li class="timeline-node">
        <a class="btn btn-info">11 DECEMBER</a>
    </li>
         </ItemTemplate>
    </asp:Repeater>
</ul>

我遇到的第一个错误是Handles 子句需要在包含类型或其基类型之一中定义的 WithEvents 变量。

如果我打开 .aspx.designer，我会注意到 li_left 和 li_right 的 withevents 已被删除，如果我手动将它们重新添加到错误消息中，则会消失，但在我运行时不会调用后面的代码。

如有任何帮助，我们将不胜感激。

编辑以显示有效答案

添加这个，它修复了一切:

Ok figured it out. I needed to process the logic in the repeater1.ItemBound

    Private Sub Repeater1_ItemDataBound(sender As Object, e As RepeaterItemEventArgs) Handles Repeater1.ItemDataBound
    Dim li_left = TryCast(e.Item.FindControl("li_left"), HtmlGenericControl)
    If IsEven(postCount) = True Then
        li_left.Style.Add("display", "visible")
    Else
        li_left.Style.Add("display", "none")
    End If

    Dim li_right = TryCast(e.Item.FindControl("li_right"), HtmlGenericControl)
    If IsEven(postCount) = True Then
        li_right.Style.Add("display", "none")
    Else
        li_right.Style.Add("display", "visible")
    End If
    postCount += 1
End Sub

Answer 1

与其使用 li_left_Load 和 li_right_Load 事件，不如使用转发器的 OnItemDataBound 事件。在那里，您可以在加载每个元素时设置它们的样式。