Asp: Repeater Image - asp.net

Question

hi,
I am facing a difficulty in understanding this example. from where the asp:repeater is taking the product images? and what is this path?
my questions are:
1) From where the background-image is taking the images, and what is this path?
2) How can I store Images in the database and assign them to each product accordingly (Binding the images with the products using the product_ID for example?
Code:
background-image: url('<%# Eval("ProductID", "../../../Img/Northwind/Products/{0}.jpg") %>');">
Best Regards.

Answer 1

About your question.
Technically, the repeater is not 'taking' images. It is generating CSS, with a reference to the background image. The browser displaying the page is then responsible for resolving the path and retrieving/displaying the images. In this case, the images are located 'up' a few directories from the location on which the page is found.
For serving images stored in a database, you have a few options.
The most common approach is to build an image handler; a simple ashx generic handler does the trick nicely.
Make the handler accept a productId via query string, grab the blob from the database using the productId, then write the blob with correct content type out to the response stream.
Once the handler is complete, you can reference the images by referring to the handler:
background-image: url('<%# Eval("ProductID", "/ImageHandler.ashx?ProductId={0}") %>');">
Edit: In response to your comment, a quick and dirty handler would look similar to this.
Obviously, you would need to add the actual logic to get the blob from the database.
public class ImageHandler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
int productId;
if (!int.TryParse(context.Request["productId"], out productId))
{
context.Response.End();
return;
}
byte[] blob = null; // get blob from DB
context.Response.ContentType = "image/jpeg";
context.Response.BinaryWrite(blob);
context.Response.End();
}
public bool IsReusable { get { return false; } }
}

Answer 2

1) From where the background-image is taking the images, and what is this path?
This is referencing to a physical folder on the hard drive. The folder has a collection of images called 1.jpg, 55.jpg etc which match up to the product id. In this sample they were probably just created manually but you could build an image upload system that would save image files with the same name as the product id of your products.
2) How can I store Images in the database and assign them to each product accordingly (Binding the images with the products using the product_ID for example?
Storing images in the database is different to whats going on here. As I say, this is just building a path to a file which has the same name as the product id. You -can- save your images in the database itself but I think this is a different discussion to the one you are looking at.
Basically the answer to your query is that in the sample they don't show you how to build a system which will let you add products to the database and upload images. It just shows you how to build some html based on existing database info and existing images.