There are two ways to save image to MS SQL database server:
1- Upload the image to server and save the path to it in SQL database.
2- Save the image as binary data in SQL
I will explain how to save image as binary data.
Create sample application:
1- Create a sample application, open the default aspx page and add to it html Input File control. Name the new control fileUpld. (you can find this control in html tab in Toolbox)
2- Add
runat=server attribute to the html of fileUpld control
3- Add a new Button to the aspx page and name it btnUpld.
4- Add the following using statements in your code behind page:
using System.Data.SqlClient;
using System.Data;
using System.Web.UI.HtmlControls;
using System.IO;5- Create a click event handler for btnUpld and add the following code to it:
string cn_str = "data source=ASP-802B70F2C32;initial catalog=imageDB; integrated security=true";
using (SqlConnection cn_sql = new SqlConnection(cn_str))
{
cn_sql.Open();
SqlCommand cmd_sql = new SqlCommand("imageAdd", cn_sql);
cmd_sql.CommandType = CommandType.StoredProcedure;
string filePath = this.fileUpld.PostedFile.FileName;
string filename = Path.GetFileName(filePath);
Stream imgStream = fileUpld.PostedFile.InputStream;
BinaryReader imgBinary = new BinaryReader(imgStream);
Byte[] bytes = imgBinary.ReadBytes((Int32)imgStream.Length);
imgBinary.Close();
imgStream.Close();
cmd_sql.Parameters.Add("@imgName", SqlDbType.Text).Value = filename;
cmd_sql.Parameters.Add("@imgType", SqlDbType.Text).Value = "image/jpeg";
cmd_sql.Parameters.Add("@imgData", SqlDbType.Binary).Value = bytes;
cmd_sql.ExecuteNonQuery();
}
6- Amend the value of connection string cn_str by replacing
ASP-802B70F2C32 with your computer name.
7- Create a new SQL database and name it imageDB.
8- In imageDB, create a new database table and name it imgTbl.
9- In imgTbl, create 4 fields and set their type as follows:
imgID: int
imgName: text
imgType: text
imgData: image
10- In imageDB, create the following stored procedure:
CREATE PROCEDURE imageAdd
(
@imgName text,
@imgType text,
@imgData image
)
AS
INSERT INTO imgTbl
(imgName,imgType,imgData)
VALUES
(@imgName,@imgType,@imgData)
GOA copy of all code behind page: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.Data;
using System.Web.UI.HtmlControls;
using System.IO;
namespace imgSave
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnUpld_Click(object sender, EventArgs e)
{
string cn_str = "data source=ASP-802B70F2C32;initial catalog=imageDB; integrated security=true";
using (SqlConnection cn_sql = new SqlConnection(cn_str))
{
cn_sql.Open();
SqlCommand cmd_sql = new SqlCommand("imageAdd", cn_sql);
cmd_sql.CommandType = CommandType.StoredProcedure;
string filePath = this.fileUpld.PostedFile.FileName;
string filename = Path.GetFileName(filePath);
Stream imgStream = fileUpld.PostedFile.InputStream;
BinaryReader imgBinary = new BinaryReader(imgStream);
Byte[] bytes = imgBinary.ReadBytes((Int32)imgStream.Length);
imgBinary.Close();
imgStream.Close();
cmd_sql.Parameters.Add("@imgName", SqlDbType.Text).Value = filename;
cmd_sql.Parameters.Add("@imgType", SqlDbType.Text).Value = "image/jpeg";
cmd_sql.Parameters.Add("@imgData", SqlDbType.Binary).Value = bytes;
cmd_sql.ExecuteNonQuery();
}
}
}
}
Try the sample application:
1- Right click on the aspx page and chose View In Browser
2- Click on Browse, select an image and click on the Button.
3- Check imgTbl to make sure the data has been sent to server.
In the next article, I will explain how to retrieve the image at runtime and display it on a page.
If you have any problems applying the above code, please leave me a post and I will reply to you.