In
this article I will explain how to insert images into our project
folder and display the images from folder in gridview based on images
path in database using asp.net. For that first create new
website after that right click on your website and add new folder and
give name as Images because here I used same name for my sample if you want to change folder name you need to change the images folder name in your code behind also first design table in your database like this to save images path in database.
Now Design your aspx page like this
Default.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
Column Name
|
Data Type
|
Allow Nulls
|
ID
|
int(set identity property=true)
|
No
|
ImageName
|
varchar(50)
|
Yes
|
ImagePath
|
nvarchar(max)
|
Yes
|
Now Design your aspx page like this
Default.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head 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="ID" HeaderText="ID" />
<asp:BoundField DataField="ImageName" HeaderText="Image Name" />
<asp:ImageField HeaderText="Image" DataImageUrlField="ImagePath" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="sqldataImages" runat="server" ConnectionString="<%$ConnectionStrings:dbconnection %>"
SelectCommand="select * from ImagesPath" >
</asp:SqlDataSource>
</div>
</form>
</body>
</html>
After completion of aspx page design add using System.IO; reference in codebehind and write the following code.
Default.aspx.cs
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["dbconnection"].ToString());
//Open the database connection
con.Open();
//Query to insert images path and name into database
SqlCommand cmd = new SqlCommand("Insert into ImagesPath(ImageName,ImagePath) 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");
}
After that set your database connection in web.config like this because we are using this connection in our sqldatasource to get the data from database.
<connectionStrings>
<add name="dbconnection" connectionString="Data Source=SureshDasari;Integrated Security=true;Initial Catalog=MySampleDB"/>
</connectionStrings >
No comments:
Post a Comment