using anchor with DataList (asp.net 2.0 with VB)

  • Thread starter Thread starter sck10
  • Start date Start date
S

sck10

Hello, I have created a photo gallery of thumbnails using the code below.
So far, I got the pictures to show, but now I need to figure out how a
viewer can click on the thumbnail and it opens the bigger picture. The
bigger file is the same name as the file stored in the array minus the
"_mini". So in the datalist, I would need to somehow wrap the image inside
of the anchor. Any help with this would be appreciated.

Thanks in advance

File
photo01.jpg (larger jpg)
photo01_mini.jpg (thumbnail)



Code Behind
-----------
Sub GetFiles(ByVal str00 As String)

Dim FileArray() As String
Dim arrFileList As ArrayList = New ArrayList()
Dim Item As String, strFileName As String = ""

ctrFor = 0
FileArray = Directory.GetFiles(Server.MapPath(str00), "*mini.jpg")

'-- Iterate the array items and display files
For Each Item In FileArray
strFileName = str00 & "/" & Mid(Item, InStrRev(Item, "\") + 1)
arrFileList.Add(strFileName)
Next

'Populate Repeater Control
arrFileList.TrimToSize() ' Trim the list
Me.dlstPhotoGallery.DataSource = arrFileList
Me.dlstPhotoGallery.DataBind()

End Sub


ASP.NET 2.0 Page
----------------
<asp:DataList id="dlstPhotoGallery" Runat="Server"
GridLines="Both"
CellPadding="1"
CellSpacing="3"
RepeatColumns="3"
RepeatDirection="Horizontal">
<ItemTemplate>
<asp:Image ID="imgPhotoGallery" ImageUrl='<%# Container.DataItem %>'
Runat="Server" />
</ItemTemplate>
</asp:DataList>
 
Hi sck10,

Welcome to the ASPNET newsgroup.

As for the displaying image thumbnails in DataList control with links to
their actual image, I think you can consider the following means:

1. Just embed the html <a> element in DataList's ItemTemplate together with
the Image control (wrapper it), e.g:

<asp:DataList ID="DataList1" runat="server">
<ItemTemplate>
<a href="http://www.asp.net">
<asp:Image ID="Image1" runat="server"
ImageUrl="~/Images/tim.JPG" />
</a>
</ItemTemplate>
</asp:DataList>



2. The ASP.NET HyperLink control support both NavigationUrl and ImageUrl
properties, and the ImageUrl property can help display an image for the
hyperlink. You can set the NavigationUrl to the actual image of the certain
thumbnail item.

Hope this helps.

Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)
 
Back
Top