Images does not shows up / Ch 14 photoalbum

Imar · July 26th, 2012, 10:55 AM

Quote:

I opened NewAlbum.aspx and added test album and use picture from your resources, and when ManagePhotoAlbums page was loaded I had only one item, the one I've entered now during this session with no sign for other previous 3. Thanks, Alex

If I interpret this correctly, then this is by design. NewAlbum.aspx does what its name implies: it creates a new album. So when you create a new album and then go to ManageAlbum, the pictures you see there are just the ones you add to that album. So, on the first request, you won't see any pictures at all. If you then upload one, you should only see that image.

Hope this helps,

Imar

akumok · July 26th, 2012, 01:09 PM

Ok, what do I have to do in order to see all albums stored in database with corresponded pictures?

akumok · July 26th, 2012, 01:14 PM

Your picture on page 518 figure 14-17 shows all the albums, mine only one with PhotoAlbumID defined in query string

Imar · July 26th, 2012, 01:21 PM

>> Your picture on page 518 figure 14-17 shows all the albums

It does not; it shows a single album (PhotoAlbumId=3) that has *multiple pictures*. Simply add more pictures to the album using the FileUpload control and they should show up (they did on my screen, with your code).

Imar

akumok · July 26th, 2012, 01:45 PM

Thank you, somehow I thought it shows all the rest of the albums with pictures, my fault

Imar · July 27th, 2012, 08:13 AM

Nope, not when editing.

When you want to *display* all albums and pictures on a single page, you can use a nested Repeater or other data control as explained in the book. Here's a quick example (using VB, but I hope you get the idea):

AllAlbums.aspx

Code:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="AllAlbums.aspx.vb" Inherits="AllAlbums" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
  <title></title>
</head>
<body>
  <form id="form1" runat="server">
  <div>
    <h1>All Albums</h1>
    <asp:Repeater ID="AllAlbums" runat="server">
      <ItemTemplate>
        <h2>
          <asp:Literal ID="Literal1" runat="server" Text='<%# Eval("Name")%>'></asp:Literal></h2>
        <asp:Repeater ID="Pictures" runat="server" DataSource='<%# Eval("Pictures")%>'>
          <ItemTemplate>
            <h3><asp:Literal ID="Literal1" runat="server" Text='<%# Eval("Description")%>'></asp:Literal></h3>
            <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("ImageUrl")%>' />
          </ItemTemplate>
        </asp:Repeater>
      </ItemTemplate>
    </asp:Repeater>
  </div>
  </form>
</body>
</html>

And the code behind:

AllAlbums.aspx.vb

Code:

 
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
Using db As New PlanetWroxModel.PlanetWroxEntities
  AllAlbums.DataSource = db.PhotoAlbums.Include("Pictures").Where(Function(x) x.Pictures.Any())
  AllAlbums.DataBind()
End Using
End Sub

This code gets all the albums and pictures (using Include("Pictures", so they are retrieved on the first sql statement and not separately for each album). I am using Any() to only retrieve albums that have at least one picture.

The markup then has a nested repeater that displays the pictures it gets from the outer repeater using Eval("Pictures"). I am just displaying the name, description and ImageUrl, but obviously you can modify the HTML to your liking.

The concepts used in this sample are all explained throughout the book, but let me know if you need any clarification.

Note: editing all albums at once is a lot more complex as you need to keep track of which album you're editing.

Cheers,

Imar