how do I retrieve multiple images from the database using c#

Question

I have a database of 9 images, which keep changing, so I cannot directly set the src in html <img> tag to display the 9 images, I have to pick them from the database and bind them accordingly.

I'm able to retrieve and print 1 image using Response.BinaryWrite(), but not all 9. My byte[] gets only the 1st image from the db,

here's the code,

 while (dr.Read())
 {
 Response.ContentType = "image/jpg";
 Response.BinaryWrite((byte[])(dr["fsImage"]));
 }

How do I retrieve all 9 images, and how do I bind them to either <asp:Image> tag or construct an html <img> tag dynamically

I'm a novice, so please take it easy on me, if there are stupid mistakes ;)

Thanks in advance.

• Hogan: Your life would be easier if you just stored the URL in the DB and then set the href tag. Is there any reason you can't do it this way? See below outline of how to do it the hard way.
• cSharpNovice: @Hogan damn, never thought of that, will give that a try ! any link to solve my problem will be of great help !

Answer 1

You can't have the web page give the content of all the images.

In order to "dynamically" render the image you need to make a page which will give you a single image. This page would use code like what you have above.

Then to pick which image to show the url to the page would change for example

http://youdomain/makeimage.aspx?imageid=1

and

http://youdomain/makeimage.aspx?imageid=2

The code in make image would then return the single image.

A note -- you will be much happier if you make the url

http://youdomain/makeimage.aspx?imageid=1&mytype=.jpg

Thus having the image url end in the extension. Some browsers (IE) cheat and look at the end of the string to see what content type to expect. They will work with a url like above but not without the trialling .jpg.

Also, you will need to implement some form of caching our your performance will be a dog (esp if you try to scale.)

Good luck.

• paan: The approach that I would take too. One note though, specifying a mime type would make all browser happy and not need to have the ".jpg" at the end
• Hogan: @paan - not my experience-- some browsers still had issues. Yes you have to specify the mime type also. That is in all examples - I was giving a note about a hard to find issue.
• paan: Noted. Maybe I've never had any problems with it. You are right. An simple extra steps to ensure compatibility is always good on the web

Answer 2

Use HttpHandler and call in Img tag

one example

<%@ WebHandler Language="C#" Class="Handler2" %>
using System;
using System.Web;
using System.Data.SqlClient;
using System.Data;
using System.Configuration;
public class Handler2 : IHttpHandler {
 public void ProcessRequest(HttpContext context)
 {
 if (context.Request.QueryString["pid"] != null)
 {
 string ID = context.Request.QueryString["pid"].ToString();
 if (dt.Rows.Count > 0)
 {
 int pid = Convert.ToInt32(ID);
 SqlConnection myConnection = new SqlConnection(ConfigurationManager.ConnectionStrings["ConnString"].ConnectionString);
 myConnection.Open();
 //int i = Convert.ToInt32(context.Request.QueryString["id"]);
 string sql = "Select BackGroundImage from Wall_BackgrndImg_Master where FK_Company_Master=@ImageId";
 SqlCommand cmd = new SqlCommand(sql, myConnection);
 cmd.Parameters.Add("@ImageId", SqlDbType.Int).Value = pid;
 cmd.Prepare();
 SqlDataReader dr = cmd.ExecuteReader();
 dr.Read();
 try
 {
 context.Response.ContentType = "jpg";
 context.Response.BinaryWrite((byte[])dr["BackGroundImage"]);
 dr.Close();
 myConnection.Close();
 }
 catch
 {
 }
 }
 }
 }
 public bool IsReusable {
 get {
 return false;
 }
 }
}

and call like

 <img src="~/handlor.ashx?pid=1">
<img src="~/handlor.ashx?pid=2">
<img src="~/handlor.ashx?pid=3">
<img src="~/handlor.ashx?pid=4">
<img src="~/handlor.ashx?pid=5">

• Darbio: This is a better solution than an aspx page.