How to Show Images from Image Library in a DataList in SharePoint 2013 Programatically?

In SharePoint 2013, if you want to show the images from a image library and with its corresponding description , we can bind it using Data List Control in ASP.NET. Here are the sample code to achieve the same.

UserControl aspx Code :-

<asp:DataList ID=”dtImagePreview” runat=”server” CellPadding=”5″ OnItemCommand=”dtImagePreview_ItemCommand” >
<ItemTemplate>
<asp:ImageButton ID=”hypImagePreview” class=”preview” height=”80″ width=”100″ ImageUrl='<%# Eval(“ImageURL”) %>’ runat=”server” CommandName=”Enlarge”>

<h2><%# Eval(“Title”) %></h2>
lblDescription” Text ='<%# Eval(“Description”) %>’ Visible=”false” runat=”server” >
<ItemStyle BorderColor=”Brown” BorderStyle=”dotted” BorderWidth=”3px” HorizontalAlign=”Center”
VerticalAlign=”Bottom” />
</asp:DataList>
</td><td>
imgcontainer” class=”Container”>
<asp:ImageButton ID=”imgEnlargedView” class=”preview” height=”80″ width=”100″ runat=”server” />
imgDescription” class=”Container” runat=”server”>
lblEnlargedDescription” Visible=”false” height=”80″ width=”600″ runat=”server”>
</div>
</div>
</td></tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</div>

User Control Code Behind Page:

SPSecurity.RunWithElevatedPrivileges(delegate()
{
using (SPSite site = new SPSite(SPContext.Current.Site.ID))
{
using (SPWeb web = site.OpenWeb(SPContext.Current.Web.ID))
{
var rootWeb = site.RootWeb;
try
{
SPList list = null;
if (ImagePreviewList == “ImageLibrary” && web.Url != site.RootWeb.Url)
list = rootWeb.Lists[ImagePreviewList];
else
list = web.Lists[ImagePreviewList];
var resultItems = list.GetItems(list.DefaultView);
var sliderItems = new List();
foreach (SPListItem item in resultItems)
{
sliderItems.Add(new SliderItem()
{
Title = item[“Title”].ToString(),
Description = item[“Description”] != null ? item[“Description”].ToString() : “NA”,
ImageURL = item[“Image”] != null ? item[“Image”].ToString() : “#”,
Active = item[“Active”] != null ? Convert.ToInt32(item[“Active”]) : 1,
Category = item[“Category”].ToString(),
MoreLinkURL = item[“MoreLinkToURL”] != null ? item[“MoreLinkToURL”].ToString() : “#”,
ID = item.ID
});
}
dtImagePreview.DataSource = sliderItems.Where(s => s.Active == 1);
dtImagePreview.DataBind();

Please check out my blog to Bind SharePoint Lists into a DropDown in SharePoint 2010/2013.

Hope the above code helps. Happy Share Pointing Folks 🙂

Leave a Reply

Your email address will not be published.