how to display image from sql table in gridview?

Question

hi i tried to display image from sql table to gridview but its not displaying this s my code to bind gridview with sql table records.. sql.aspx.cs protected void Page_Load(object sender EventArgs e) { if (!IsPostBack) { lblsession.Text = Welcome + Convert.ToString(Session[UName]); sessionimage(); } } private void sessionimage() { SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings[connect].ConnectionString); try { string UName = (string)Session[UName]; SqlDataAdapter Adp = new SqlDataAdapter(select Photo from TBL_PBLogin where UName='+ UName +' con); DataTable Dt = new DataTable(); con.Open(); Adp.Fill(Dt); gridviewphoto.DataSource = Dt; gridviewphoto.DataBind(); con.Close(); } catch (Exception ex) { throw new Exception(ex.ToString()); } } sql.aspx ' height=50px width=50px />

Vincent Maverick Durano · Answer

You are almost there. Just include the EmpID in your query: SqlDataAdapter Adp = new SqlDataAdapter(select EmpIDPhoto from TBL_PBLogin where EmpID=' + EmpID + ' con);

Carlos kambui · Answer

tStudent = new StudentType(); byte[] bytes = new byte[0]; if ((ds.Tables[0].Rows[0][image]) ==DBNull.Value) { tStudent.image = bytes; } else { bytes = (byte[])(ds.Tables[0].Rows[0][image]); tStudent.image = bytes; }

Vincent Maverick Durano · Answer

s-sreelakshmi That wont work for his case as he is storing the image as binary in the database. Please try to read the entire post again. Thanks Vinz

S Sreelakshmi · Answer

---Grid View--- ' /> --- bind data-- protected void Page_Load(object sender EventArgs e) { if (!IsPostBack) { bindimages(); } } private void bindimages() { SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings[connect].ConnectionString); try { SqlDataAdapter Adp = new SqlDataAdapter(select Photo from TBL_PBLogin con); DataTable Dt = new DataTable(); con.Open(); Adp.Fill(Dt); gridviewphoto.DataSource = Dt; gridviewphoto.DataBind(); con.Close(); } catch (Exception ex) { throw new Exception(ex.ToString()); } foreach (GridViewRow gr in gridviewphoto .Rows) { HiddenField h = (HiddenField)gr.FindControl(hdimg); Image img = (Image)gr.FindControl(imgphoto); if (h.Value != ) { img.ImageUrl = ~/UserImages/ + h.Value; // Actaul image } else { img.ImageUrl = ~/images/profle.png; // Default image } } }

Nanhe Siddique · Answer

read this link http://www.aspsnippets.com/Articles/Display-images-from-SQL-Server-Database-in-ASP.Net-GridView-control.aspx it may help you

Deepak Ratan · Answer

Vincent Maverick Durano I had tryed inside the ProcessRequest in Handler.ashx but i am getting the same ISSUE context . Response . ContentType = image/png ; Handler.ashx using System; using System.Web; using System.Data.SqlClient; using System.Data; using System.IO; using System.Collections.Specialized; using System.Configuration; public class Handler : IHttpHandler { public void ProcessRequest(HttpContext context) { if (context.Request.QueryString[EmpID] == null) return; string connStr = ConfigurationManager.AppSettings[connect].ToString(); string pictureId = context.Request.QueryString[EmpID]; using (SqlConnection conn = new SqlConnection(connStr)) { using (SqlCommand cmd = new SqlCommand(SELECT Photo FROm TBL_PBLogin WHERE EmpID = @EmpId conn)) { cmd.Parameters.Add(new SqlParameter(@EmpID pictureId)); conn.Open(); using (SqlDataReader reader = cmd.ExecuteReader(CommandBehavior.CloseConnection)) { reader.Read(); context.Response.ContentType = image/png; context.Response.BinaryWrite((Byte[])reader[reader.GetOrdinal(Photo)]); reader.Close(); } } } } public bool IsReusable { get { return false; } } }

Vincent Maverick Durano · Answer

Ok so your GridView shows up in the page but the only the image is not displaying? Can you try setting the ContentType of the context within your ProcessRequest() method like: context . Response . ContentType = image/png ;

Deepak Ratan · Answer

Vincent Maverick Durano Just i had keept the break point in gridviewphoto.DataSource = Dt; -> I am Getting EmpID Photo 1 System.Byte[] gridviewphoto.DataBind();

Vincent Maverick Durano · Answer

Your code looks good to me. The least you can do now is to debug your code set a break point and step through it. Check if your GridView has any data to it. Keep in mind that when your datasource is empty then your GridView will not be shown in the page.

Deepak Ratan · Answer

HI Vincent Maverick Durano  Is there any Issue in my code? to display the image?

Deepak Ratan · Answer

Actually there is a problem in uploading only .rar files are uploading These are my listview: Solution 'login'(1 project) * Login -> Image ->Handler.ashx ->login.aspx ->login.aspx.cs ->PostBookChat.aspx ->PostBookChat.aspx.cs

Vincent Maverick Durano · Answer

I don't have rar extractor. Can you link a screenshot instead.

Deepak Ratan · Answer

HI

Vincent Maverick Durano · Answer

Can you please post (screenshot) your project solution structure here? I want to see where exactly the file is located.

Deepak Ratan · Answer

Hi I had tryed but its not working is there any other way?

Vincent Maverick Durano · Answer

And when you debug the ProcessRequest() method never get hit? Can you try referencing the path like this: ~/ Handler.ashx?id= + Eval(EmpID) %>' />

Deepak Ratan · Answer

Actually its in same location where the PostBookChat.aspx located Just i had right click and gave add new generic handler and i had written my code Handler.ashx using System; using System.Web; using System.Data.SqlClient; using System.Data; using System.IO; using System.Collections.Specialized; using System.Configuration; public class Handler : IHttpHandler { public void ProcessRequest(HttpContext context) { if (context.Request.QueryString[EmpID] == null) return; string connStr = ConfigurationManager.AppSettings[connect].ToString(); string pictureId = context.Request.QueryString[EmpID]; using (SqlConnection conn = new SqlConnection(connStr)) { using (SqlCommand cmd = new SqlCommand(SELECT Photo FROm TBL_PBLogin WHERE EmpID = @EmpId conn)) { cmd.Parameters.Add(new SqlParameter(@EmpID pictureId)); conn.Open(); using (SqlDataReader reader = cmd.ExecuteReader(CommandBehavior.CloseConnection)) { reader.Read(); context.Response.BinaryWrite((Byte[])reader[reader.GetOrdinal(Photo)]); reader.Close(); } } } } public bool IsReusable { get { return false; } } }

Vincent Maverick Durano · Answer

Where did you put your Handler? based on your code your Handler file should be in the same location where your page is located.

Deepak Ratan · Answer

There is a small Issue is that  the photo is not displaying using break point i had compiled its not moving to Handler.ashx

Vincent Maverick Durano · Answer

The error is pretty much self-explanatory. That means the Id field isn't in your select query. You need to replace that with the unique identifier that holds your Images. In other words replace the ID with the primary key of your table where your image is stored. So for example if you have this table: TBL_PBLogin YourPrimaKeyID Photo then make sure that you include the PrimaryKey in your SQL select statement: Select YourPrimaryKeyID Photo From TBL_PBLogin Does that make sense?

Deepak Ratan · Answer

DataBase: TBL_PBLogin EmpID PK (11) UName varchar(50) Password varchar(50) photo image PostBookChat.aspx ItemTemplate > ' /> PostBookChat.aspx.cs protected void Page_Load(object sender EventArgs e) { if (!IsPostBack) { lblsession.Text = Welcome + Convert.ToString(Session[UName]); sessionimage(); } } private void sessionimage() { SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings[connect].ConnectionString); try { int EmpID = (int)Session[EmpID]; SqlDataAdapter Adp = new SqlDataAdapter(select Photo from TBL_PBLogin where EmpID=' + EmpID + ' con); DataTable Dt = new DataTable(); con.Open(); Adp.Fill(Dt); gridviewphoto.DataSource = Dt; gridviewphoto.DataBind(); con.Close(); } catch (Exception ex) { throw new Exception(ex.ToString()); } } Handler.ashx using System; using System.Web; using System.Data.SqlClient; using System.Data; using System.IO; using System.Collections.Specialized; using System.Configuration; public class Handler : IHttpHandler { public void ProcessRequest(HttpContext context) { if (context.Request.QueryString[EmpID] == null) return; string connStr = ConfigurationManager.AppSettings[connect].ToString(); string pictureId = context.Request.QueryString[EmpID]; using (SqlConnection conn = new SqlConnection(connStr)) { using (SqlCommand cmd = new SqlCommand(SELECT Photo FROm TBL_PBLogin WHERE EmpID = @EmpId conn)) { cmd.Parameters.Add(new SqlParameter(@EmpID pictureId)); conn.Open(); using (SqlDataReader reader = cmd.ExecuteReader(CommandBehavior.CloseConnection)) { reader.Read(); context.Response.BinaryWrite((Byte[])reader[reader.GetOrdinal(Photo)]); reader.Close(); } } } } public bool IsReusable { get { return false; } } }

Deepak Ratan · Answer

HI tryed many time but getting same error DataBinding: 'System.Data.DataRowView' does not contain a property with the name 'Id'.

Vincent Maverick Durano · Answer

You need to pass the ID to your handler. It should look like this: asp:Image ID =Image runat =server ImageUrl =' Handler.ashx?id = + Eval(Id) %>' /> Please read back the tutorial again so you will know how it works.

Upendra Pratap Shahi · Answer

no error getting..

rajshree soni · Answer

Hii CellPadding=4 ForeColor=#333333 GridLines=None PageSize=6 Style=position: static > '> '> ' Width=100 Height=100 /> '> '> Try this > >  width=100 height=100> > > code for.cs da = new SqlDataAdapter(select Slip_NONAME_VISITOR v_image IN_TIMEVISITOR_VILLAGE from visitor_check_in where Slip_NO =(select max(Slip_NO) from visitor_check_in ) con); ds = new DataSet(); da.Fill(ds visitor_check_in); GridView1.DataSource = ds.Tables[visitor_check_in].DefaultView; GridView1.DataBind();

Deepak Ratan · Answer

Hi Vincent Maverick Durano I am getting an Issue that i con't access the Handler.ashx '/>

Vincent Maverick Durano · Answer

Yes.

Deepak Ratan · Answer

hi Thankyou i will try by that way but we have to use Generic Handler also?

Dipankar Biswas · Answer

protected void btn_up_new_img_Click(object sender EventArgs e) { if (up_load_new_img.PostedFile.ContentLength > 0) { s1 = Path.GetFileName(up_load_new_img.FileName); path = Server.MapPath(file_upload) + / + s1; up_load_new_img.SaveAs(path); } SqlConnection ronicon = new SqlConnection(strConnString); ronicon.Open(); SqlCommand ronicom = new SqlCommand(sp_up_img ronicon); ronicom.CommandType = CommandType.StoredProcedure; ronicom.Connection = ronicon; ronicom.Parameters.AddWithValue(@usr_name lb1.Text); ronicom.Parameters.AddWithValue(@usr_upload_image s1); ronicom.ExecuteNonQuery(); ronicom.Dispose(); save_and_show(); ronicon.Close(); }

Vincent Maverick Durano · Answer

You need use MemoryStream object to display the image since you are storing the image as blob. The first link in my first post should help you. Just refer that.

Deepak Ratan · Answer

Hi By this way i am saving the image in database protected void signout_Click(object sender EventArgs e) { if (!Fileuploadprofilepick.HasFile) { lblerror.Text = Please select the photo; } else { int length = Fileuploadprofilepick.PostedFile.ContentLength; byte[] pic = new byte[length]; Fileuploadprofilepick.PostedFile.InputStream.Read(pic 0 length); SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings[connect].ConnectionString); string query = INSERT INTO TBL_PBLogin (UNamePasswordPhoto) VALUES (@UName@Password@Photo); try { con.Open(); SqlCommand cmd = new SqlCommand(query con); cmd.Parameters.Add(@UName txtUname.Text); cmd.Parameters.Add(@Password txtUpassword.Text); cmd.Parameters.Add(@Photo pic); cmd.CommandType = CommandType.Text; cmd.ExecuteNonQuery(); lblerror.Visible = true; lblerror.Text = Uploaded Sucessfully; con.Close(); ClearControl(); } catch (Exception ex) { throw new Exception(ex.ToString()); } }

Deepak Ratan · Answer

Hi Dipankar Biswas  we have to create this folder? in VS

Vincent Maverick Durano · Answer

You can check your database and see the value of Photo column. or You could debug your code and check the DataTable row values. How do you store the image to your database?

Deepak Ratan · Answer

Hi Vincent Maverick Durano  using signup option i am giving UsernamePasswordfileupload by this way i am saving the image in database Actually i dont no how to find the image in database Sorry can u give some idea

Dipankar Biswas · Answer

Folder path..

Vincent Maverick Durano · Answer

@deepak the image already stored in database but there is an ISSUE to retrive the image from database to gridview I believe the issue is the mapping of the url path for your images. What is the path of your images that is stored in your database? The path should match with the actual location of your images when setting the ImageUrl or SRC for the image control.

Vincent Maverick Durano · Answer

What is file_upload ? Is that ID of fileupload button? No. That's the folder name containing your images. So you have to change that based on the folder where you host/put your images.

Deepak Ratan · Answer

Hi Vincent Maverick Durano  When the user login  the user login photo should display thats y i am trying the image already stored in database but there is an ISSUE to retrive the image from database to gridview

Deepak Ratan · Answer

HI Dipankar Biswas src ='file_upload/ %#Eval(usr_upload_image) %>' height=600px width=550px/> What is file_upload ? Is that ID of fileupload button?

Vincent Maverick Durano · Answer

The path of your image should match to where the image is hosted. Otherwise it will not display. Please take a look at the article that I've posted for your reference.

Deepak Ratan · Answer

Hi Dipankar Biswas Actually i am compare both code almost same I don't y the photo is not displaying What datatype you are using for image

Vincent Maverick Durano · Answer

Are you saving the image path only to database or the image blob? here are some step by step example that I wrote before that might help: If the image is stored in database as blob http://geekswithblogs.net/dotNETvinz/archive/2009/04/24/faq-displaying-image-from-database-to-gridview-control.aspx If the image url is saved to the database only: http://geekswithblogs.net/dotNETvinz/archive/2009/08/02/uploading-and-storing-image-path-todatabase-and-image-to-folder.aspx

Dipankar Biswas · Answer

Hi.. sorry Deepak am not getting any error here.

Deepak Ratan · Answer

Hi ERROR: The photo is not displaying ' height=50px width=50px />

Dipankar Biswas · Answer

Hi Try it.. private void bindgrid() { string useremail = (string)Session[useremail]; SqlConnection con = new SqlConnection(strConnString); con.Open(); str = select user_profile_pic from tbl_user where user_email=' + useremail + '; sqlda = new SqlDataAdapter(str con); dt = new DataTable(); sqlda.Fill(dt); sqlda.Dispose(); GridView1.DataSource = dt; GridView1.DataBind(); con.Close(); } BackColor=#CC3300 ForeColor=Black ShowHeader=False > ' height=600px width=550px/>