How to display the multiple rows of images in gridview from sql table

Question

I have asp.net Gridview control, In that I'm going to show the two columns one is text field and another one is image field. The grid should be expandable and should show the all the images. When i run the page all the rows images are showing the same one. How to resolve this issue?

![Grid view results][1]

I have used the Imagehandler file

     SqlConnection conn = new SqlConnection(connString);
     string sqlsts = "SELECT us.name, us.image from userdetails as us where us.user_id in (select user_id from user_team where team_id  in (select team_id from teaminfo where teamname='" + team + "'))";
     SqlCommand command = new SqlCommand(sqlsts, conn);
     conn.Open();
     DataTable dtst = new DataTable();
     SqlDataAdapter adp = new SqlDataAdapter(sqlsts, conn);
     adp.Fill(dtst);
     int roc = dtst.Rows.Count;
     int coc = dtst.Columns.Count;
     for (int i = 0; i < roc; i++)
     {
         Byte[] imageData = (Byte[])dtst.Rows[i]["image"];
         context.Response.BinaryWrite((Byte[])dtst.Rows[i]["image"]);
         context.Response.ContentType = "image/jpeg";
         context.Response.End();
      }

Answer 1

Your handler, though running through a loop, will only return the first image it comes across.

By calling these lines....:

     context.Response.BinaryWrite((Byte[])dtst.Rows[i]["image"]);
     context.Response.ContentType = "image/jpeg";
     context.Response.End();

.....your essentially saying "Ok, you can stop now and spit out that image" - your other images in the loop won't be reached.

Your handler should really only return a SINGLE image.

So change your handler so it delivers just ONE image, you can put the ID of the image you want to display in the querystring, and then call the handler from your gridview.

Something like (example, not tested)

  <asp:TemplateField  HeaderText="MyImage">
     <ItemTemplate>
        <asp:Image runat="server" ImageURL='<%# Eval("imageID", "myHandler.ashx?id={0}") %>' />
     </ItemTemplate>
  </asp:TemplateField>

Your handler can now get the id querystring, select the appropriate image from your database and then Response.BinaryWrite() it.