Buy Questpond's video subscriptions on huge discount.
DotNetFunda.com
Online: 905
Home > Forums > ASP.NET >

Image Uploading Issue

Posted by Raj.Trivedi under ASP.NET on 8/8/2013 | Points: 10 | Views : 1829 | Status : [Member] [MVP] | Replies : 4
Write New Post | Search Forums | AnsweredResolved Posts | Un Answered Posts | Forums Home 
Hello Team,

I have a folder named Images and i am uploading the images to a folder and storing just the name of the image with extension in the database.

Now i want to bind that image to an Image Control on a Page not inside a Grid View or data list i am just using a Image Control.

I tried using ImageUrl = Path.Combine(Server.Mappath("~/Images"),ds.tables[0].Rows[0]["ImageName"].toString());

But it is not giving me the Image Display

I also tries using Eval directly in HTML Mark up

Like ImageUrl=ProductImages/'<%#Eval("ImageName"))%>'

None of them are working

To Summarise, I want to bind the Image to a Image a Control where the name of the image is stored in the database and the image is in folder.

Regard's
Raj.Trivedi
"Sharing is Caring"
Please mark as answer if your Query is resolved

Reply | Reply with Attachment
Alert Moderator 

Responses

Posted by: Satyapriyanayak on: 8/9/2013 [Member] [MVP] Silver | Points: 25

Up
0
Down
http://www.c-sharpcorner.com/uploadfile/17e8f6/inserting-and-reading-image-tofrom-database-in-Asp-Net-web-application-in-image-control/

If this post helps you mark it as answer
Thanks

Raj.Trivedi, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Bandi on: 8/12/2013 [Member] [MVP] Platinum | Points: 25

Up
0
Down
Refer these two links for understanding inserting image path into database & image into a folder and displaying image using ASP .NET
http://www.aspdotnet-suresh.com/2011/01/how-to-insert-images-into-database-and.html
http://www.aspdotnet-suresh.com/2011/03/how-to-save-images-into-folder-and.html

Mark This Response as Answer
--
Chandu
http://www.dotnetfunda.com/images/dnfmvp.gif

Raj.Trivedi, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Bandi on: 8/12/2013 [Member] [MVP] Platinum | Points: 25

Up
0
Down
//Default.aspx 
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



<html xmlns="http://www.w3.org/1999/xhtml" >

<head id="Head1" runat="server">

<title>Inserting images into databse and displaying images with gridview</title>

<style type="text/css">

.Gridview

{

font-family:Verdana;

font-size:10pt;

font-weight:normal;

color:black;

width:500px;

}

</style>

</head>

    <body>

        <form id="form1" runat="server">

            <div>

                <asp:GridView ID="gvImages" CssClass="Gridview" runat="server" AutoGenerateColumns="False" 

                        HeaderStyle-BackColor="#7779AF" HeaderStyle-ForeColor="white">

                <Columns> 

                <asp:BoundField HeaderText = "Image Name" DataField="imagename" />

                <asp:TemplateField HeaderText="Image">

                <ItemTemplate>

                <asp:Image ID="Image1" runat="server" ImageUrl='<%# "ImageHandler.ashx?ImID="+ Eval("ImageID") %>' Height="150px" Width="150px"/>

                </ItemTemplate>

                </asp:TemplateField>

                </Columns>

                </asp:GridView>

            </div>

        </form>

    </body>

</html>


//Default.cs 
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data.SqlClient;

using System.Configuration;

using System.Data;



namespace WebApplication1

{

    public partial class Default : System.Web.UI.Page

    {

        string strcon = ConfigurationManager.ConnectionStrings["dbConnStrings"].ConnectionString;

        protected void Page_Load(object sender, EventArgs e)

        {

            if (!IsPostBack)

            {

                BindGridData();

            }

        }



        /// <summary>

        /// function is used to bind gridview

        /// </summary>

        private void BindGridData()

        {

            SqlConnection connection = new SqlConnection(strcon);

            SqlCommand command = new SqlCommand("SELECT imagename,ImageID from ImageUpload", connection);

            SqlDataAdapter daimages = new SqlDataAdapter(command);

            DataTable dt = new DataTable();

            daimages.Fill(dt);

            gvImages.DataSource = dt;

            gvImages.DataBind();

            gvImages.Attributes.Add("bordercolor", "black");

        } 

    }

}


--ASP .NET Web Handler 
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Data.SqlClient;

using System.Configuration;



namespace WebApplication1

{

    /// <summary>

    /// Summary description for ImageHandler

    /// </summary>

    public class ImageHandler : IHttpHandler

    {

        string strcon = ConfigurationManager.AppSettings["dbConnStrings"].ToString();

        public void ProcessRequest(HttpContext context)

        {

            string imageid = context.Request.QueryString["ImID"];

            SqlConnection connection = new SqlConnection(strcon);

            connection.Open();

            SqlCommand command = new SqlCommand("SELECT Image from ImageUpload where ImageID=" + imageid, connection);

            SqlDataReader dr = command.ExecuteReader();

            dr.Read();

Note: Continuation code will be available in the next post

Mark This Response as Answer

--

Chandu

http://www.dotnetfunda.com/images/dnfmvp.gif
Raj.Trivedi, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Bandi on: 8/12/2013 [Member] [MVP] Platinum | Points: 25

Up
0
Down
Continue from above code 
            context.Response.BinaryWrite((Byte[])dr[0]);

            connection.Close();

            context.Response.End();

        }



        public bool IsReusable

        {

            get

            {

                return false;

            }

        }

    }

}


--Image into Folder 
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ImageintoFolder.aspx.cs" Inherits="WebApplication1.ImageintoFolder" %>



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">

<title>Save Images In Folder and Display Images in Gridview from folder</title>

<style type="text/css">

.Gridview

{

font-family:Verdana;

font-size:10pt;

font-weight:normal;

color:black; 

}

</style>

</head>

    <body>

        <form id="form1" runat="server">

            <div>

            <asp:FileUpload ID="fileuploadimages" runat="server" />

            <br />

            <asp:Button ID="btnSubmit" runat="server" Text="Submit" onclick="btnSubmit_Click" />

            </div>

            <div>

            <asp:GridView runat="server" ID="gvImages" AutoGenerateColumns="false" DataSourceID="sqldataImages" CssClass="Gridview" HeaderStyle-BackColor="#61A6F8" >

            <Columns>

            <asp:BoundField DataField="ImageId" HeaderText="ID" />

            <asp:BoundField DataField="ImageName" HeaderText="Image Name" />

            <asp:ImageField HeaderText="Image" DataImageUrlField="Image" />

            </Columns>

            </asp:GridView>

            <asp:SqlDataSource ID="sqldataImages" runat="server"  ConnectionString="<%$ConnectionStrings:dbConnStrings %>"

            SelectCommand="select * from ImageUpload" >

            </asp:SqlDataSource>

            </div>

        </form>

    </body>

</html>


-- Image into Folder .cs 
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data.SqlClient;

using System.IO;

using System.Configuration;



namespace WebApplication1

{

    public partial class ImageintoFolder : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {



        }



        protected void btnSubmit_Click(object sender, EventArgs e)

        {

            //Get Filename from fileupload control

            string filename = Path.GetFileName(fileuploadimages.PostedFile.FileName);

            //Save images into Images folder

            fileuploadimages.SaveAs(Server.MapPath("Images/" + filename));

            //Getting dbconnection from web.config connectionstring

            SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["dbConnStrings"].ToString());

            //Open the database connection

            con.Open();

            //Query to insert images path and name into database

            SqlCommand cmd = new SqlCommand("Insert into ImageUpload(ImageName,Image) values(@ImageName,@ImagePath)", con);

            //Passing parameters to query

            cmd.Parameters.AddWithValue("@ImageName", filename);

            cmd.Parameters.AddWithValue("@ImagePath", "Images/" + filename);

            cmd.ExecuteNonQuery();

            //Close dbconnection

            con.Close();

            Response.Redirect("~/Default.aspx");

        }

    }

}


web.config: 
<connectionStrings>

	<add name="dbConnStrings" connectionString="Data Source=ServerName; Initial Catalog=DBName; User Id=UserName; Password=pwd" />

</connectionStrings>



Mark This Response as Answer
--
Chandu
http://www.dotnetfunda.com/images/dnfmvp.gif

Raj.Trivedi, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response

Latest Posts