Dynamically set timeline in html on page .aspx

Question

Dynamically set timeline in html on page .aspx

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I would like to ask a little help from the forum, to dynamically set up a timeline in html using the asp.net font or code behind C #, in a Web Forms application with SQL database. I need to mount I imagine, for this a for each in the aspx code to go creating htmls structures with CSS in the posts format as updates ... See the structure in html:

<ul class="timeline">
  <!-- timeline time label -->
  <li class="time-label">
    <span class="bg-red">
                    10 Feb. 2014
                  </span>
  </li>
  <!-- /.timeline-label -->
  <!-- timeline item -->
  <li>
    <i class="fa fa-envelope bg-blue"></i>

    <div class="timeline-item">
      <span class="time"><i class="fa fa-clock-o"></i> 12:05</span>

      <h3 class="timeline-header"><a href="#">Support Team</a> sent you an email</h3>

      <div class="timeline-body">
        Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning heekya handango imeem plugg dopplr jibjab, movity jajah plickers sifteo edmodo ifttt zimbra. Babblely odeo kaboodle quora plaxo ideeli hulu weebly balihoo...
      </div>
      <div class="timeline-footer">
        <a class="btn btn-primary btn-xs">Read more</a>
        <a class="btn btn-danger btn-xs">Delete</a>
      </div>
    </div>
  </li>
</ul>
<!-- END timeline item -->
<!-- timeline item -->

Could someone give me a light, to dynamically make this structure inside a .aspx page.

html c# asp.net css webforms

asked by anonymous 08.07.2017 / 17:00

2 answers

0

I have no experience with .aspx, but dynamic pages usually use your idea, put together a structure like the code entered where the 'ul' tag would be out of the loop and the 'li' would be inside your for

08.07.2017 / 17:42

Python - Conditional expression Favicon .ico vs hosting

score 1 · Accepted Answer

You can use repeater for this:

<ul class="timeline">
    <asp:Repeater runat="server" ID="RptTime">
        <ItemTemplate>
            <li class="time-label">
                <span class="bg-red"><%# Eval("DATA") %></span>
            </li>
            <li>
                <i class="fa fa-envelope bg-blue"></i>

                <div class="timeline-item">
                    <span class="time"><i class="fa fa-clock-o"></i><%# Eval("HORA") %></span>

                    <h3 class="timeline-header"><a href="#"><%# Eval("LINK") %></a> sent you an email</h3>

                    <div class="timeline-body">
                        <%# Eval("TEXTO") %>
                    </div>
                    <div class="timeline-footer">
                        <a class="btn btn-primary btn-xs">Read more</a>
                        <a class="btn btn-danger btn-xs">Delete</a>
                    </div>
                </div>
            </li>
        </ItemTemplate>
    </asp:Repeater>
</ul>

and in your code behind you receive the database;

RptTime.DataSource = datatable;
RptTime.DataBind();

Basically this, see more about repeater here