.NET and SQL: Do I need to build a custom control? - html

Question

I'm working off of the default Web Forms template in VS 2013, and one of the rows has 3 divs:
<div class="col-md-4">
<h2>Get Paid</h2>
<img src="Images/adp_logo.gif" class="img-responsive" alt="ADP" />
<p>
Everybody wants to get paid! Just click on the "ADP" link to monitor or change your timesheet, benefits
information, 401K contributions, etc...
</p>
<p>
<a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301948">Go! »</a>
</p>
</div>
<div class="col-md-4">
<h2>Get Help</h2>
<asp:ImageButton ID="imgBtn2" runat="server" ImageUrl="~/Images/user_help.png" Height="100" />
<p>
Don't know how to do something? We can help! Click the image above to find answers about how to get a badge,
share your Outlook calendar, or make a great cup of coffee (okay, maybe not the last one, but you get the idea...)
</p>
<p>
<a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301949">Go! »</a>
</p>
</div>
<div class="col-md-4">
<h2>Find the People You Need</h2>
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/Images/find_icon.png" Height="100" />
<p>
You can easily find information about anybody that works at ERC. Just click and go!
</p>
<p>
<a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301950">Go! »</a>
</p>
</div>
I'd like to be able to populate these divs with information from a database row. For example, in my database I'd have a table that had Title, Image, Description, Link and Category columns. If a row had a Category of "Featured", it would populate the first element with it's Title value, the tag with the image, etc.
Do I need to build a custom control to accomplish this, or am I just overlooking an obvious way of achieving this?
By the way, the Google Play store is what I'm modeling this after, if that helps...
Thanks...

Answer 1

Like David said, a .NET Repeater control would be ideal for what you want to achieve. You would add your html template once and it would, well, repeat it according to your database query and the number of entries that it would extract.
Html. Note that single quotes ARE REQUIRED when binding data to an attribute like 'src', 'href', etc:
<asp:Repeater ID="myRepeater" runat="server">
<ItemTemplate>
<div class="col-md-4">
<h2><%# Eval("Title") %></h2>
<img src='<%# Eval("Image") %>' class="img-responsive" alt="ADP" />
<p>
<%# Eval("Description") %>
</p>
<p>
<a class="btn btn-default" href='<%# Eval("Link") %>'>Go! »</a>
</p>
</div>
</ItemTemplate>
</asp:Repeater>
Code-behind C#:
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack) {
bindRepeater();
}
}
protected void bindRepeater() {
DatabaseEntities db = new DatabaseEntities();
var query = (from q in db.myTableName
where q.Category == "Featured"
select q);
if (query.Count() > 0)
{
myRepeater.DataSource = query.ToArray();
myRepeater.DataBind();
}
}