In our previous post, we saw how to build user controls and reference the same from our Home Page layout. In this post lets see how we can retrieve the Latest News from a SharePoint List rather than static HTML code.
Latest News
Jet30 publishes their latest news daily and wishes to show them in the Home Page. The Latest News section in our home page reflected this daily news section.
Jet30 wants their content authors to manage the daily news and hence they choose to create a new Announcements List called LatestNews where they can manage (add/edit/delete) the daily news. The Latest News section should only display the news of that day.
As you can see in the above screenshot, we have 2 items which expires today (October 6th) and the other which has expired (October 5th).
Injecting the SharePoint Logic into our user control
We now know our exact job – Query the LatestNews list for the items which expires today
The LatestNews user control now changes to:
We will use a Label to update today’s date and a Repeater to display today’s latest news.
Below is the updated .ascx code:
<div id="news">
<h2>Latest News</h2>
<h3><asp:Label ID="lblDate" runat="server" /></h3>
<asp:Repeater ID="rptrNews" runat="server">
<ItemTemplate>
<p>
<span><%# DataBinder.Eval(Container.DataItem,"Title")%></span>
<%# DataBinder.Eval(Container.DataItem,"Title")%>
</p>
</ItemTemplate>
</asp:Repeater>
<br class="spacer" />
</div>
And below is the code behind:
/// <summary>
/// Handles the Load event of the Page control.
/// </summary>
/// <param name="sender">The source of the event.</param>
/// <param name="e">The <see cref="System.EventArgs"/>
/// instance containing the event data.</param>
protected void Page_Load(object sender, EventArgs e)
{
AddTodaysDate();
AddTodaysNews();
}
/// <summary>
/// Adds the todays date.
/// </summary>
private void AddTodaysDate()
{
lblDate.Text = String
.Format("On {0}",
DateTime.Today.ToString("ddd d MMM yyy"));
}
/// <summary>
/// Adds the todays news.
/// </summary>
private void AddTodaysNews()
{
List<LatestNews> latestNewsCollection = new List<LatestNews>();
SPSite site = SPContext.GetContext(HttpContext.Current).Site;
using (SPWeb curWeb = site.OpenWeb())
{
SPList lstLatestNews = curWeb.Lists["LatestNews"];
SPQuery camlQuery = new SPQuery();
camlQuery.ViewFields = "<FieldRef Name='Title' /><FieldRef Name='Body' />";
camlQuery.Query =
"<Where><Geq><FieldRef Name='Expires' /><Value Type='DateTime'><Today/></Value></Geq></Where>";
SPListItemCollection lstLatestNewsCollection = lstLatestNews.GetItems(camlQuery);
foreach (SPListItem latestNews in lstLatestNewsCollection)
{
LatestNews news = new LatestNews
{
Title = latestNews["Title"].ToString(),
Body = latestNews["Body"].ToString()
};
latestNewsCollection.Add(news);
}
rptrNews.DataSource = latestNewsCollection;
rptrNews.DataBind();
}
}
Pretty basic ASP.NET and SharePoint code :)
The AddTodaysDate updates the label with today’s date and AddTodaysNews queries the SharePoint list LatestNews items which expires today.
Build the code and deploy to the site.
You should still see the same home page, the only difference this time being that Latest News section is now content driven :)
What about Web Parts?
You might be wondering why I haven’t used Web Parts and chosen to build User Controls. I think this discussion would take us away from our current trending topic, but do hold on, I will come up with a separate post explaining why I choose to build User Controls and not Web Parts in the WCM world.
What next?
In our next post, we will see the necessity of building custom field controls and build one!
For now, you can download the source code from here.
If you don’t have SPVisualDev, build a WSP package and deploy it to test.
Remember that, until we have our own site definition, we are not done yet and things will be little messy :)