how to show image not found in Asp.net MVC

Question

I have a asp.net mvc project. in a speicific views i call the four image from different different folder inside my proect.

sometime image can not be found. i want to set a image for every folder because all 4 folder contain different diffent size of image so i need to set the image of specific size for each folder.

how i can show the default image when the image not found any way to do that.i means call the none.png when the directory not have image who i called in the views.

are their any way to show the image in the case of image not found.

any way to do that in asp.net 4 MVC 3. using web.config or setting anything else.

Answer 1

Easiest way to do this is with a html helper. Please be mindful of the extra performace hit of checking the file system before even showing an image filename. The hit is a small one though, so you won't notice any issues unless you are getting very high traffic. Then you can implement some sort of caching so the app "knows" if the file exists or not.

You can use a custom html helper for it

public static class ImageHtmlHelpers
{
   public static string ImageUrlFor(this HtmlHelper helper, string contentUrl)
   {
       // Put some caching logic here if you want it to perform better
       UrlHelper urlHelper = new UrlHelper(helper.ViewContext.RequestContext);
       if (!File.Exists(helper.ViewContext.HttpContext.Server.MapPath(contentUrl)))
       {
           return urlHelper.Content("~/content/images/none.png");
       }
       else
       {
           return urlHelper.Content(contentUrl);
       }
   }
}

Then in your view you can just make the url using:

<img src="<% Html.ImageUrlFor("~/content/images/myfolder/myimage.jpg"); %>" />

EDIT: As Jim pointed out, I haven't really addressed the sizing issue. Personally I use automatic size request management/size which is a whole other story, but if you are concerned about the folders/sizes simply pass that information in to build the path. As below:

public static class ImageHtmlHelpers
{
   public static string ImageUrlFor(this HtmlHelper helper, string imageFilename, ImageSizeFolderEnum imageSizeFolder)
   {
       UrlHelper urlHelper = new UrlHelper(helper.ViewContext.RequestContext);
       string contentUrl = String.Format("~/content/userimages/{0}/{1}", imageSizeFolder, imageFilename);
       if (!File.Exists(helper.ViewContext.HttpContext.Server.MapPath(contentUrl)))
       {
           return urlHelper.Content(String.Format("~/content/userimages/{0}/none.png", imageSizeFolder));
       }
       else
       {
           return urlHelper.Content(contentUrl);
       }
   }
}

Then in your view you can just make the url using:

<img src="<% Html.ImageUrlFor("myimage.jpg", ImageSizeFolderEnum.Small); %>" />

Have suggested an Enum for better programmatic control if the folder is a fixed set, but for a quick and nasty approach, not reason why you can't just use a string if the folder is db generated etc.