CODEWITHSUNDEEP
asp.netsql-servergridviewimageurl
jan
jan

Reputation: 67

GridView cannot display image

Sorry for troubling. Im trying to display the selected fields in a asp.net gridview. i can display everything except the "product_img" where i should display the relevant picture in the gridview.

The problem is in gridview when i attached image url of image control to code-'<%#"InsertProd.aspx.cs?path" %>' is not working as it's giving me null images/broken image link.

is my method of binding the path upon dr.read to the imageURL in gridview wrong?? i have edited my code behind page as below and design aspx page as bottom.

the code for designer page is located below underneath,upon scroll down. thank you.

    protected void gvShowInsert_SelectedIndexChanged(object sender, EventArgs e)
    {
        SqlCommand cmd = new SqlCommand("SELECT product_cakeName, product_price,      
        product_qty,product_desc,product_img FROM Tbl_Products", conn);

        conn.Open();

        SqlDataReader dr;
        dr = cmd.ExecuteReader();
        if(dr.Read())
        {
           //Context.Response.BinaryWrite((byte[])dr[dr.GetOrdinal("product_img")]);


          byte[] path = (byte[])dr["product_img"]; //read the path of image

        }//imageControl.ImageUrl = path; //set the path to image control


        gvShowInsert.DataSource = dr;
        gvShowInsert.DataBind();
        dr.Close();
        conn.Close();
    }

this is my design aspx:

<Columns>
   <asp:TemplateField HeaderText="cake-name">
       <ItemTemplate>
            <asp:Label ID="lblHeaderName"   
            runat="server"Text='<%#Eval("product_cakeName") %>'></asp:Label>    
       </ItemTemplate>
  </asp:TemplateField>
 <asp:TemplateField HeaderText="price">
   <ItemTemplate>
   <asp:Label ID="lblHeaderPrice" runat="server" Text='<%#Eval("product_price")  
           %>'></asp:Label>    
    </ItemTemplate>
 </asp:TemplateField>
 <asp:TemplateField HeaderText="qty">
 <ItemTemplate>
 <asp:Label ID="lblHeaderQty" runat="server" Text='<%#Eval("product_qty") %>'></asp:Label>    
 </ItemTemplate>
 </asp:TemplateField>
 <asp:TemplateField HeaderText="desc">
 <ItemTemplate>
 <asp:Label ID="lblHeaderDesc" runat="server" Text='<%#Eval("product_desc") %>'>
 </asp:Label>    
 </ItemTemplate>
 </asp:TemplateField>
 <asp:TemplateField HeaderText="img">
 <ItemTemplate>
<asp:Image ID="imageControl" runat="server" ImageUrl='<%#"InsertProd.aspx.cs?path" %>' >
</asp:Image>    
</ItemTemplate>
</asp:TemplateField>
</Columns>

Upvotes: 3

Views: 4488

Answers (2)

Antonio Bakula
Antonio Bakula

Reputation: 20693

You need an URL for ASP.NET Image server control, thus you have to serve image in another request, ashx handler are suitable for that. So remove binary image field from initial sql select, you will fetch it later.

First step is to render url form image, hope that you have real ID in that table, not just product_cakeName, something like this :

<asp:Image ID="imageControl" runat="server" ImageUrl='ServeImage.ashx?cake=<%#Eval("product_cakeName") %>' >

And then create ServeImage.ashx, select just binary image field from database for cake that was requested trough param "cake", and serve it (set Request.OutputStream or use Request.BinaryWrite).

Here is an complete example : http://www.shabdar.org/asp-net/81-display-images-in-gridview-from-database-in-aspnet.html

Upvotes: 0

Ricketts
Ricketts

Reputation: 5223

If you have the image path, or image filename, stored in the database, why not just assign it like you do the values for the other controls? Like this:

If your database stores the entire path, do this:

<asp:Image ID="imageControl" runat="server" ImageUrl='<%# Eval("product_img") %>'></asp:Image>

If your database only has the filename, do this:

<asp:Image ID="imageControl" runat="server" ImageUrl='<%# String.Format("~/path/to/image/" + Eval("product_img")) %>'></asp:Image>

Good Luck!

Upvotes: 3

Related Questions