Chapter14 Try it Out Page 515

tostermann · #1 (**permalink**) November 29th, 2010, 10:58 PM

After I create a new photo album and upload a pictuture, the picture doesn't display in the browser on the "Manage Photo Album" page. In IE, I get the red "X" error and in FireFox just an empy space is displayed. Am I missing something in the code or is it a system issue.

I believe the pictures are uploadig because I can see and view them from the GigPics folder with the new GUID after the insert process.

Latest information:

I get the same behavior when I run the Chapter 14 website from the downloaded source code. Also, "Display Pictures" is checked under Tools-->Internet Options--> Advanced in IE.

Imar · #2 (**permalink**) November 30th, 2010, 04:00 AM

>> get the same behavior when I run the Chapter 14 website

That could be correct for some albums, as the images are first created as simple text box controls. Only later are the files actually uploaded.

Can you show the markup of the page where you set up the ImageUrl and the Code Behind for the page? Also, what do you see when you look in the PhotoAlbum and Picture tables?

Imar

tostermann · #3 (**permalink**) November 30th, 2010, 02:27 PM

Here is my mark for the Markup for the "ManagePhotoAlbum" page:

Code:

<%@ Page Title="Manage Photo Album" Language="C#" MasterPageFile="~/Site/MasterPages/Frontend.master" AutoEventWireup="true" CodeFile="ManagePhotoAlbum.aspx.cs" Inherits="_ManagePhotoAlbum" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="cpMainContent" Runat="Server">
    <asp:ListView ID="ListView1" runat="server" DataKeyNames="Id" 
        DataSourceID="EntityDataSource1" InsertItemPosition="LastItem" 
        oniteminserting="ListView1_ItemInserting">
        <InsertItemTemplate>
            <li style="">
                 Description:
                <asp:RequiredFieldValidator ID="regDesc" ControlToValidate="DescriptionTextBox" runat="server" ErrorMessage= "Enter a description."></asp:RequiredFieldValidator>
                <asp:TextBox ID="DescriptionTextBox" runat="server" MutiLine="True"
                    Text='<%# Bind("Description") %>' />
                <br />ToolTip:
                <asp:RequiredFieldValidator ID="reqToolTip" ControlToValidate="ToolTipTextBox" runat="server" ErrorMessage= "Enter a tool tip."></asp:RequiredFieldValidator>
                <asp:TextBox ID="ToolTipTextBox" runat="server" Text='<%# Bind("ToolTip") %>' />
                <asp:FileUpload ID="FileUpload1" runat="server" />
                <br />
                <asp:CustomValidator ID="cusValImage" runat="server" ErrorMessage="Select a valid .jpg file"></asp:CustomValidator>
                <br />
                <asp:Button ID="InsertButton" runat="server" CommandName="Insert" 
                    Text="Insert" />
                <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" 
                    Text="Clear" CausesValidation="False"/>
            </li>
        </InsertItemTemplate>
        <ItemTemplate>
            <li style="">
                Description:
                <asp:Label ID="DescriptionLabel" runat="server" 
                    Text='<%# Eval("Description") %>' />
                <br />
                ToolTip:
                <asp:Label ID="ToolTipLabel" runat="server" Text='<%# Eval("ToolTip") %>' />
                <asp:Image ID="ImageURL" runat="server" ImageUrl='<%# Eval("ImageURL")%>' />
                <br />
                <asp:Button ID="DeleteButton" runat="server" CommandName="Delete" 
                    Text="Delete" CausesValidation="False" />
            </li>
        </ItemTemplate>
        <LayoutTemplate>
            <ul class="ItemContainer">
                <li runat="server" id="itemPlaceholder" />
            </ul>
         </LayoutTemplate>
    </asp:ListView>
    <asp:EntityDataSource ID="EntityDataSource1" runat="server" 
        ConnectionString="name=PlanetWroxEntities" 
        DefaultContainerName="PlanetWroxEntities" EnableDelete="True" 
        EnableFlattening="False" EnableInsert="True" EntitySetName="Pictures" 
        Where="it.PhotoAlbum.Id =@photoAlbumId" 
        oninserting="EntityDataSource1_Inserting">
        <WhereParameters>
            <asp:QueryStringParameter Name="PhotoAlbumId" QueryStringField="PhotoAlbumId" 
                Type="Int32" />
        </WhereParameters>
    </asp:EntityDataSource>
</asp:Content>

Here is my C# CodeBide for the same file:

[code]

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using PlanetWroxModel;

public partial class _ManagePhotoAlbum : BasePage
{
protected void Page_Load(object sender, EventArgs e)
{

}
protected void EntityDataSource1_Inserting(object sender, EntityDataSourceChangingEventArgs e)
{
int photoAlbumId = Convert.ToInt32(Request.QueryString.Get("PhotoAlbu mId"));
Picture myPicture = (Picture)e.Entity;
myPicture.PhotoAlbumId = photoAlbumId;

FileUpload FileUpload1 =
(FileUpload)ListView1.InsertItem.FindControl("File Upload1");
string virtualFolder = "~/Site/GigPics";
string physicalFolder = Server.MapPath(virtualFolder);
string fileName = Guid.NewGuid().ToString();
string extention = System.IO.Path.GetExtension(FileUpload1.FileName);

FileUpload1.SaveAs(System.IO.Path.Combine(physical Folder,fileName + extention));
myPicture.ImageURL = virtualFolder + fileName + extention;
}
protected void ListView1_ItemInserting(object sender, ListViewInsertEventArgs e)
{
FileUpload FileUpload1 =
(FileUpload)ListView1.InsertItem.FindControl("File Upload1");
if (!FileUpload1.HasFile || !FileUpload1.FileName.ToLower().EndsWith(".jpg"))
{
CustomValidator cusValImage =
(CustomValidator)ListView1.InsertItem.FindControl( "cusValImage");
cusValImage.IsValid = false;
e.Cancel = true;
}

}
}

FYI, my GigPics folder is under a Site foler at the base of my website. I know this is a little differ than your setup. I setup the structure wrong at the start of the book. However, I have been able to get the other items to work with small changs to paths without any issues.

Thanks!

Imar · #4 (**permalink**) November 30th, 2010, 02:50 PM

Quote:

FYI, my GigPics folder is under a Site foler at the base of my website.

That might explain the differnet. Can you show me the following?

1. Exact address (including http) of the ManagePhotoAlbum.aspx in the browser.

2. What do you see when you request /Site in your browser for your site's address?

3. What address do you get when you right-click the GigPics folder in the Solution Explorer and choose View in Browser?

4. When you look at the source in the browser, how are the images linked?

Finally, not sure what you mean with "at the base of my website". Can you post the physical structure of the site on disk? And did you set the Virtual Path property?

Lots of questions, but somehow something is wrong and I am trying to figure out what that is...

Cheers,

Imar

tostermann · #5 (**permalink**) November 30th, 2010, 04:53 PM

1. http://localhost:3779/BegASPNET/ManagePhotoAlbum.aspx

2. Directory Listing -- /BegASPNET/Site/

--------------------------------------------------------------------------------

[To Parent Directory]

Tuesday, November 30, 2010 01:09 PM <dir> Controls
Tuesday, November 30, 2010 01:09 PM <dir> Demos
Tuesday, November 30, 2010 01:09 PM <dir> GigPics
Tuesday, November 30, 2010 01:09 PM <dir> Images
Tuesday, November 30, 2010 01:09 PM <dir> MasterPages
Tuesday, November 30, 2010 01:09 PM <dir> Scripts
Tuesday, November 30, 2010 01:09 PM <dir> Styles
Tuesday, November 30, 2010 01:09 PM <dir> WebServices

--------------------------------------------------------------------------------
Version Information: ASP.NET Development Server 10.0.0.0

3. Directory Listing -- /BegASPNET/Site/GigPics/

--------------------------------------------------------------------------------

[To Parent Directory]

Monday, November 29, 2010 08:27 PM 46,815 4f631601-a46a-443e-9eac-ac14962aacc5.jpg
Monday, November 29, 2010 08:28 PM 46,815 512f191f-ea79-49aa-a216-b6183f1098be.jpg
Monday, November 29, 2010 08:07 PM 50,170 7ed9eb16-5caa-45ef-8d74-bc2ce7f2dd5f.jpg
Monday, November 29, 2010 08:18 PM 40,109 941def79-2d93-4d9b-8f23-c7f8d692b339.jpg
Monday, November 29, 2010 08:11 PM 41,477 e69ccfba-a30e-4edf-b3f4-e6742323eec9.jpg

--------------------------------------------------------------------------------
Version Information: ASP.NET Development Server 10.0.0.0

4. Based on the results of #3, I believe so. If I click a link from the ones above,I see the picture. I can also see the path when I right-click the image placeholder on the page.

5. The site is at C:\BegASPNET
About
App_Code
App_Data
App_Themes
Management
Reviews
Site
--------
Controls
Demos
GigPics
Images
MasterPages Folders enclosed in --- in Site folder
Scripts
Styles
WebServices
------------
Default.aspx
Login.aspx
ManagePhotoAlbum.aspx
NewPhotoAlbum.aspx
Web.config
Web.sitemap

Virtual Path: /BegASPNET

I hope these responses help answer you questions. Thanks for all your help on this. I have worked on this issue for hours. I know it is something simple. Learning C# and ASP.Net has been a slow up hill climb for me over the past couple of years, after coming from a FoxPro development job for 9 years. Your book is great! Do you have one for just C#?

Imar · #6 (**permalink**) November 30th, 2010, 06:04 PM

Hi there,

A few things you can try:

1. Make sure you open C:\BegASPNET/Site in Visual Studio as the root of the site.

2. Set the Virtual Path to / as explained in an earlier chapter.

3. Use MapPath("~/GigPics") as I have in my code.

I think that should fix the problem. If not, please let me know.

Cheers,

Imar

tostermann · #7 (**permalink**) December 1st, 2010, 11:44 PM

I finally was able to solve my problem after stepping away for a day and looking at it with fresh eyes.

I restructured my website to be in the same layout as the book. However, that didn't help. Ater running a couple tests and looking closer at the data being inserted into the database tables, I realized that GigsPics was part of my picture names in the ImageURL.

It turns out this was because of a typo in my virtual folder string.

string virtualFolder = "~/Site/GigPics";

when changed to string virtualFolder = "~/Site/GigPics/"; in the code behind it works great.

I knew it was something simple. Thanks for your help! The book is great.

Imar · #8 (**permalink**) December 2nd, 2010, 03:59 AM

Ah, yes, that makes perfect sense. Thanks for posting a follow up.

Cheers,

Imar

Need to download code?

Navigation