Sample for Displaying Images from the Database using Dynamic Data

I’m posting a sample project that shows some custom field template controls for Dynamic Data that allow images to be viewed/edited from a database. The sample also shows how you can view images that have their filenames in the database but the images on the physical disk. You can download the sample by clicking this download link: DOWNLOAD SAMPLE

Here are the basics sets that are required if you want to add this functionality into you own Dynamic Data project:


1) Reference the DbImageAPI library in the sample to your Dynamic Data website.

2) Copy DbImage.ascx., DbImage.ascx.cs, DbImage_Edit.ascx, DbImage_Edit.ascx.cs, FileImage.ascx, FileImage.ascx.cs from the samples App_Shared/DynamicDataFields directory to the App_Shared/DynamicDataFields directory on your website.

3) Copy the Blank.gif from the samples App_Shared/Images to the App_Shared/Images directory in your website.

4) In the Web.Config file add "

<add verb="*" path="ImageHandler.ashx" type="DbImageAPI.ImageHandler"/>
" to the <httpHandlers> section.


Once these are done you just need to apply renderhints to the data model. For example if the table in the database is Categories you would create a partial class called Category and add the following metadata to the partial class:

[ImageFormat("Picture", 100, 100)]
[RenderHint("Picture", "DbImage")]
public partial class Category {



The RenderHint tells it to use the DbImage field template control to render the Picture column. There is also an additional attribute added which allows the width and height the image to be set as well. The ImageFormat attribute causes the control the dynamically scale the image keeping the proper aspect ratio.


If you have a database column that has filenames of images that exist in a directory in the website you can use the FileImage control. Here is an example:

[RenderHint("Filename", "FileImage")]
[ImageUrl("Filename", "~/images/{0}")]
[ImageFormat("Filename", 100, 100)]
public partial class FilePicture {


In this case the table in the database is FilePictures and a partial class of FilePIcture has been created to apply the attributes. The RenderHint tells it to render the Filename column using the FileImage field template control. The ImageUrl attribute is used to specify where on the website the images are located, in this cas the images are in the images directory underneath the root. And once again the ImageFormat attribute is used to specify a width/height. In the case of file based images this attribute just changes the width and height tags on the image.


I will go into much more detail about how these controls were created in a future blog post.

Comments (18)

  1. One of the new things we are working on in ASP.NET is not directly connected to the new and improved

  2. Justice says:

    I really liked your post.  I found a couple of issues.  They could just be me, but these are the issues I ran into, and the solutions (probably not the greatest, but functioning).  1) I had issues with uniqueidentifiers for PKs

    2) I had an issue with empty Data / no cache key

    Thank you for the cool post.  Keep it up!


    object value = null;

               if (member.Type == typeof(Guid))


                   value = new Guid(primarykeyvalue);




                   value = Convert.ChangeType(primarykeyvalue, member.Type, CultureInfo.InvariantCulture);


    // DBImage_Edit

    if (MetadataAttributes.TryGetValue("ImageFormat", out metadata))


               string tablename = MetaMember.MetaTable.Name;

               string primarykeyname = MetaMember.MetaTable.IdentityMetaMembers[0].Name;

               string primarykeyvalue = DataBinder.GetPropertyValue(DataItem, primarykeyname).ToString();

               string cachekey = string.Format("{0}:{1}:{2}", tablename, DataField, primarykeyvalue);

               ViewState["CacheKey"] = cachekey;

               //check if image exists

               if (DataValue == null || metadata == null)




               SavedDataValue = DataValue;


               int width = 100;

               int height = 100;

               bool displayinedit = true;

               IDictionary<string, object> metadatadict = (IDictionary<string, object>)metadata;

               width = (int)metadatadict["Width"];

               height = (int)metadatadict["Height"];

               displayinedit = (bool)metadatadict["DisplayInEdit"];

               //display picture if in edit mode,

               if (TemplateMode == DynamicTemplateMode.EditItemTemplate && displayinedit)


                   //set image properties

                   PlaceHolderImage.Visible = true;

                   ImageEdit.ImageUrl = "~/ImageHandler.ashx?table=" + tablename + "&column=" + DataField + "&pkv=" + primarykeyvalue + "&width=" + width.ToString() + "&height=" + height.ToString();



  3. Are you planning on making a generic file handler?

  4. Jeff says:

    the MetadataAttribues.TryGetValue is causing an error for me.

  5. Scott Hunter says:

    I posted a sample back in January on how to display images from databases or the file system using Dynamic

  6. Andrei says:

    I cannot compile DbImageAPI in VS 2008 (without SP1) with 3.5 Beta framework.

    I got the following errors:

    The type or namespace name ‘BaseMetadataAttribute’ could not be found (are you missing a using directive or an assembly reference?)

    The type or namespace name ‘ValidationAttribute’ could not be found (are you missing a using directive or an assembly reference?

    What could be wrong?

    Nice example,

    Thank you.

  7. chosenek says:

    Nice one Scott. But its made for extension CTP? I got SP1 and can’t compile it. It needs 3.6 extension. But in sp1 is 3.5.

  8. Carlos Pinto says:

    I work on VB and in my case I only see the original images in DB, but updating and inserting new ones, not work.

    Ps- You had any version in VB?

  9. Johua says:

    Can anyone tell me where can I find ImageHandler.ashx

  10. Peter says:

    How do we fix the code i cant seem to find

    BaseMetadataAttribute and this is the only tutorial around..

  11. Rob says:

    This is great!

    Once files are attached as dbimage or linked to the filesystem for instance PDF, do you know a way to call that PDF into an RDLC report as an image frame along with other data fields from the table(s)?

    Thank you!

  12. Ralf says:

    Maybe you build this example with CTP release?

    I try to update the example with SP1 and the hints from

    but it still wont compile.

    Here are my errors:

    The type or namespace name ‘BaseMetadataAttribute’ could not be found (are you missing a using directive or an assembly reference?) ImageUrlAttribute.cs DbImageAPI

    The type or namespace name ‘ValidationAttribute’ could not be found (are you missing a using directive or an assembly reference?) ImageFormat.Attribute.cs DbImageAPI

    Kind regards


  13. John says:

    Hi Scott

    Any plans to update this?  As Ralf noted above this doesn’t compile with later versions of VS 2010.  Just tried with the RC and get a multitude of errors while compiling.  Shame as a really useful addition.



  14. Jameson says:

    Hi Scott,

    I'd like to add to the requests to have this code updated so that it compiles with runtime 3.5, or 4.



  15. Yannick says:

    Is there any update on this yet? Very interesting post, but like you guys I can't compile.

  16. Jan says:

    This sample is outdated. Please post an update.

  17. Msbh says:

    I compiled but couldnt accesed the databas 🙁 its not adding picture in in database any idea how can i do it?