How to display binary images into a gridview in ASP.NET using C#?

I want to display binary images into a gridview named ‘gvExistedCharacter’. I did research about it and many of them suggested to use a handler. However, I have no idea how can I do about it.

FYI: The datatype of the image in the database is image and named ‘blueBallImage’. I also want to display its level which is int in the same gridview.

I have tried

    SqlConnection con = new SqlConnection(@"Data Source=localhost;Initial Catalog=MyCloudGames;Integrated Security=True");

    SqlCommand cmd = new SqlCommand("Select blueBallImage FROM CorrespondingBall", con);
    cmd.CommandType = System.Data.CommandType.Text;
    cmd.Connection = con;

    SqlParameter ImageID = new SqlParameter("@characterID", System.Data.SqlDbType.Int);
    ImageID.Value = context.Request.QueryString["characterID"];
    cmd.Parameters.Add(ImageID);
    con.Open();
    SqlDataReader dReader = cmd.ExecuteReader();
    dReader.Read();
    context.Response.BinaryWrite((byte[])dReader["Image"]);
    dReader.Close();
    con.Close();

I received an error “The parameterized query ‘(@characterID int)Select blueBallImage FROM CorrespondingBall’ expects the parameter ‘@characterID’, which was not supplied.”

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

You can use handler to display image in gridview , your html markup look like inside

Gridview ItemTemplate set image control src as src=~/ShowImage.ashx?id=" + id

where ShowImage.ashx is your handler which return MemoryStream((byte[])img);

In your case your querystring is characterID

so your image src would be src=~/ShowImage.ashx?id=" + characterID


Updated Answer:

Html Markup:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
    <Columns>
        <asp:TemplateField HeaderText="CharacterID">
            <ItemTemplate>
                <asp:Label ID="lblid" runat="server" Text='<%# Bind("characterID") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="GameLevel">
            <ItemTemplate>
                <asp:Label ID="lblglevel" runat="server" Text='<%# Bind("gameLevel") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Image">
            <ItemTemplate>
                <asp:Image ID="Image1" runat="server" ImageUrl='<%#"ShowImage.ashx?getID="+Eval("characterID") %>' />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

Code behind:
protected void Page_Load(object sender, EventArgs e)
{        
    DataTable dt = getData();
    GridView1.DataSource = dt;
    GridView1.DataBind();
  }

public  DataTable getData() 
{
  SqlDataAdapter dap = new SqlDataAdapter("select characterID,blueBallImage,gameLevel from CorrespondingBall", cn);
  DataSet ds = new DataSet();
  dap.Fill(ds);
  return ds.Tables[0];
}

Generic handler: Add new generic handler here showIamges.ashx is my generic handler
public void ProcessRequest(HttpContext context)
 {
    Int32 my_Id;
    if (context.Request.QueryString["getID"] != null)
    {
       my_Id = Convert.ToInt32(context.Request.QueryString["getID"]);
       context.Response.ContentType = "image/jpeg";
       Stream strm = ShowEmpImage(my_Id);
       byte[] buffer = new byte[4096];
       int byteSeq = strm.Read(buffer, 0, 4096);
       while (byteSeq > 0)
        {
           context.Response.OutputStream.Write(buffer, 0, byteSeq);
           byteSeq = strm.Read(buffer, 0, 4096);
        }
      }
}

public Stream ShowEmpImage(int my_Id)
{
   string conn = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
   SqlConnection connection = new SqlConnection(conn);
   string sql = "select blueBallImage from CorrespondingBall WHERE characterID = @ID";
   SqlCommand cmd = new SqlCommand(sql, connection);
   cmd.CommandType = CommandType.Text;
   cmd.Parameters.AddWithValue("@ID", my_Id);
   connection.Open();
   object img = cmd.ExecuteScalar();
   return new MemoryStream((byte[])img);
 }

Method 2

You want to add @characterID parameter to your sql command but your command doesn’t have a parameter called @characterID.

Remove your parameter process in your code or add @characterID in your sql command which try to match.


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x