I use asp.net, c# and mysql.
So how can I insert selected image from gridview to mysql table? Please show me some examples.
The inserted images will be displayed in the GridView control.
The GridView has a OnRowDataBound event handler assigned which will be used for displaying the Image inserted in MySql database.
HTML
<asp:FileUpload ID="FileUpload1"
runat="server" />
<asp:Button Text="Upload"
runat="server"
OnClick="UploadFile" />
<asp:GridView ID="gvImages"
runat="server"
AutoGenerateColumns="false"
OnRowDataBound="OnRowDataBound">
<Columns>
<asp:BoundField HeaderText="File Id"
DataField="FileId" />
<asp:BoundField HeaderText="File Name"
DataField="FileName" />
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1"
runat="server"
Height="80"
Width="80" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
C#
protected void UploadFile(object sender, EventArgs e)
{
string filename = Path.GetFileName(FileUpload1.PostedFile.FileName);
string contentType = FileUpload1.PostedFile.ContentType;
using (Stream fs = FileUpload1.PostedFile.InputStream)
{
using (BinaryReader br = new BinaryReader(fs))
{
byte[] bytes = br.ReadBytes((Int32)fs.Length);
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (MySqlConnection con = new MySqlConnection(constr))
{
string query = "INSERT INTO Files(FileName, ContentType, Content) VALUES (#FileName, #ContentType, #Content)";
using (MySqlCommand cmd = new MySqlCommand(query))
{
cmd.Connection = con;
cmd.Parameters.AddWithValue("#FileName", filename);
cmd.Parameters.AddWithValue("#ContentType", contentType);
cmd.Parameters.AddWithValue("#Content", bytes);
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}
Response.Redirect(Request.Url.AbsoluteUri);
}
The Above event handler gets executed when the Upload Button is clicked, it first converts the uploaded image file to BYTE array using BinaryReader class and then saves the Image file as Binary data (BLOB) in the MySql Database.
The name of the file, the content type (MIME type) and the actual file as array of bytes are inserted into the MySql database table.
Note: The Content type (MIME type) is very important while downloading the files as it notifies the browser about type of the File.
Related
Dear all I am displaying an image in my gridview, this image is saved in database in varbinary format, with its content type and image name. And my image in gridview is displaying perfect, now I want to insert this same image from gridview to another table from the button click outside the gridview, How do I achieve this can anyone please guide me? I tried achieving it by receiving this image data from gridview such as Varbinary data - which is an image in database and content type and imagename into textbox but it thorws an error "Implicit conversion from data type nvarchar to varbinary(max) is not allowed. Use the CONVERT function to run this query"
<asp:TemplateField HeaderText="" ItemStyle-Width="" Visible="true">
<ItemTemplate>
<asp:HyperLink ID="HyperLink1" class="preview" ToolTip='<%#Bind("StaffName") %>'
NavigateUrl='' runat="server">
<asp:ImageButton runat="server" ID="Image2" class="img2" ImageUrl='<%# Eval("ImageName") %>'
CommandName='<%# Eval("Id") %>' CommandArgument='<%# Eval("ImageName") %>' />
</asp:HyperLink>
<asp:TextBox ID="txtFileType" runat="server" Text='<%# Eval("FileType") %>' Visible="true"></asp:TextBox>
<asp:TextBox ID="txtBData" runat="server" Text='<%# Eval("BData") %>' Visible="true"></asp:TextBox>
<asp:TextBox ID="txtImageName" runat="server" Text='<%# Eval("ImageName") %>' Visible="true"></asp:TextBox>
<br />
<br />
</ItemTemplate>
<ControlStyle Width="100%" />
<HeaderStyle HorizontalAlign="Left" VerticalAlign="Middle" Width="10%" />
<ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" Width="20%" />
</asp:TemplateField>
foreach (GridViewRow row1 in gvImage.Rows)
{
if (row1.RowType == DataControlRowType.DataRow)
{
// txtFileType
// txtBData
// txtImageName
TextBox txtFileType, txtBData, txtImageName;
txtFileType = (row1.Cells[1].FindControl("txtFileType") as TextBox);
txtBData = (row1.Cells[1].FindControl("txtBData") as TextBox);
txtImageName = (row1.Cells[1].FindControl("txtImageName") as TextBox);
string constr = ConfigurationManager.ConnectionStrings["CONNECTION"].ConnectionString;
using (SqlConnection con8 = new SqlConnection(constr))
{
string query = "insert into SShare (FId,UDetails,ShareBy,ShareByUserId,BData,FileType,ImageName) values(#FId,#UDetails,#ShareBy,#ShareByUserId,#BData,#FileType,#ImageName)";
using (SqlCommand cmd8 = new SqlCommand(query))
{
cmd8.Parameters.AddWithValue("#FId", txt_Tester.Text);
cmd8.Parameters.AddWithValue("#UDetails", TextBox1.Text);
cmd8.Parameters.AddWithValue("#ShareBy", txt_StaffId.Text);
cmd8.Parameters.AddWithValue("#ShareByUserId", txt_Employee.Text);
cmd8.Parameters.AddWithValue("#BData", txtBData.Text);
cmd8.Parameters.AddWithValue("#FileType", txtFileType.Text);
cmd8.Parameters.AddWithValue("#ImageName", txtImageName.Text);
con8.Open();
// cmd8.ExecuteNonQuery();
this.ExecuteQuery(cmd8, "SELECT");
con8.Close();
}
}
}
}
Here is what I suggest. You could get all the data out of the grid, but you can also just do it in SQL.
Notice BDAta is NOT a SqlParameter, it is pulled from the Employee table:
INSERT INTO [SShare](FId,UDetails,ShareBy,ShareByUserId,BData,FileType,ImageName)
SELECT #FId, #UDetails, #ShareBy, #ShareByUserId, BData, #FileType, #ImageName
FROM Employee
WHERE FId = #FId;
After beating head everywhere atlast I figured out and I am posting it incase if someone may refer to. Thanks to #Crowcoder for giving a logic to make it happen.
foreach (GridViewRow row1 in gvImage.Rows)
{
if (row1.RowType == DataControlRowType.DataRow)
{
string Id = gvImage.DataKeys[row1.RowIndex].Value.ToString();
ImageButton imgbtn = (ImageButton)gvImage.Rows[row1.RowIndex].FindControl("Image2");
string filename = imgbtn.ImageUrl;
TextBox ftype = (row1.FindControl("txtFileType") as TextBox);
byte[] bytes = (byte[])GetData("SELECT BData FROM Employee WHERE Id =" + txt_StaffId.Text).Rows[0]["BData"];
string base64String = Convert.ToBase64String(bytes, 0, bytes.Length);
imgbtn.ImageUrl = "data:image/png;base64," + base64String;
{
string constr = ConfigurationManager.ConnectionStrings["CONNECTION"].ConnectionString;
using (SqlConnection con8 = new SqlConnection(constr))
{
string query = "insert into SShare (FId,UDetails,ShareBy,ShareByUserId,BData,ImageName, FileType) values(#FId,#UDetails,#ShareBy,#ShareByUserId,#BData,#ImageName,#FileType)";
using (SqlCommand cmd8 = new SqlCommand(query))
{
cmd8.Parameters.AddWithValue("#FId", txt_Tester.Text);
cmd8.Parameters.AddWithValue("#UDetails", TextBox1.Text);
cmd8.Parameters.AddWithValue("#ShareBy", txt_StaffId.Text);
cmd8.Parameters.AddWithValue("#ShareByUserId", txt_Employee.Text);
cmd8.Parameters.AddWithValue("#BData", bytes);
cmd8.Parameters.AddWithValue("#ImageName", filename);
cmd8.Parameters.AddWithValue("#FileType", ftype.Text);
con8.Open();
// cmd8.ExecuteNonQuery();
this.ExecuteQuery(cmd8, "SELECT");
con8.Close();
}
}
}
}
}
I have a gridview that populates from an SQL table and shows two columns, one comes from an integer data column, the other from an nvarchar. Gridview also has a checkbox column
The gridview populates correctly, and after a subset of rows is selected (via checkbox column) I want to insert the selected rows into another SQL table. When populating the variables for the SQL statement however I get the "Cannot Convert from string to int" error on the value that is populated from an int to begin with.
I have tried writing up convert and parse for this statement but still getting the error:
cmd.Parameters.AddWithValue("#PracticeArea", int.Parse(row.Cells["Id"].Value));
cmd.Parameters.AddWithValue("#PracticeArea", Convert.ToInt32(row.Cells["Id"].Value));
cmd.Parameters.AddWithValue("#PracticeArea", Convert.ToInt32(row.Cells["Id"].Text));
All still show the error on the ["Id"] value.
Any thoughts?
Example of the data that is being populated to the gridview is:
PracticeID PracticeName
1 General Surgical Pathology
2 General Pathology/Basic Science
4 Cardiovascular
6 Cytopathology-GYN
7 Cytopathology-nonGYN
Full button command is:
protected void Bulk_Insert(object sender, EventArgs e)
{
foreach (GridViewRow row in GridView1.Rows)
{
if ((row.FindControl("CheckBox1") as CheckBox).Checked)
{
string connectionString = WebConfigurationManager.ConnectionStrings["CS1"].ConnectionString;
SqlConnection con = new SqlConnection(connectionString);
{
using (SqlCommand cmd = new SqlCommand("INSERT INTO ReviewerPractice VALUES(#Reviewer, #PracticeArea)", con))
{
cmd.Parameters.AddWithValue("#Reviewer", ReviewerName.Text);
cmd.Parameters.AddWithValue("#PracticeArea", Convert.ToInt32(row.Cells["Id"].Value));
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}
}
Full Gridview control is:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Id" HeaderText="Id" ItemStyle-Width="30" />
<asp:BoundField DataField="PracticeName" HeaderText="PracticeName" ItemStyle-Width="150" />
</Columns>
</asp:GridView>
<br />
<asp:Button ID="Button1" Text="Add Practice Areas" OnClick="Bulk_Insert" runat="server" />
Hope this answers (some?) of the questions from all the comments to date.
The problem is that row.Cells[] is an array, so you need to use it like this:
row.Cells[3].Text
And it's better to use the Parameters for sql like this:
cmd.Parameters.Add("#PracticeArea", SqlDbType.Int).Value = Convert.ToInt32(row.Cells[index].Text;
I am currently having trouble with data binding. I am still learning on how to have a correct way to make data binding. The problem is DataBinding: 'System.Data.Common.DataRecordInternal' does not contain a property with the name 'fileName'.
As far as I understand, the data binding is the fileName that need to be tally with the back end coding but although I made it the same, the error still occur. Below is my aspx.cs coding.
protected void DownloadFile(object sender, EventArgs e)
{
int id = int.Parse((sender as LinkButton).CommandArgument);
//byte[] bytes;
string fileName;
string connectionString = System.Configuration.ConfigurationManager.ConnectionStrings["Ulysses"].ConnectionString;
using (SqlConnection con = new SqlConnection(connectionString))
{
using (SqlCommand cmd = new SqlCommand())
{
cmd.CommandText = "SELECT TOP 10 OLE_LINK_FILE_NAME FROM OLE_LINK";
//cmd.Parameters.AddWithValue("#Id", id);
cmd.Connection = con;
con.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
sdr.Read();
fileName = sdr["OLE_LINK_FILE_NAME"].ToString();
}
con.Close();
}
}
Response.Clear();
Response.Buffer = true;
Response.Charset = "";
Response.Cache.SetCacheability(HttpCacheability.NoCache);
//Response.ContentType = contentType;
Response.AppendHeader("Content-Disposition", "attachment; filename=" + fileName);
//Response.BinaryWrite(bytes);
Response.Flush();
Response.End();
}
Here is my HTML coding:
<asp:GridView ID="GridView1" runat="server" HeaderStyle-BackColor="#3AC0F2" HeaderStyle-ForeColor="White"
RowStyle-BackColor="#A1DCF2" AlternatingRowStyle-BackColor="White" AlternatingRowStyle-ForeColor="#000"
AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="OLE_LINK_FILE_NAME" HeaderText="File Name"/>
<asp:TemplateField ItemStyle-HorizontalAlign = "Center">
<ItemTemplate>
<asp:LinkButton ID="lnkDownload" runat="server" Text="Download" OnClick="DownloadFile"
CommandArgument='<%# Eval("fileName") %>'></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
From the coding, where actually did I miss with the parameter fileName?
The data source you are setting for GridView1, is List of System.Data.Common.DataRecordInternal and I think your class System.Data.Common.DataRecordInternal either don't have property with the name fileName or it's scope is limited. If it exist, try to make it public.
from your comment below. You should replace fileName by OLE_LINK_FILE_NAME in command argument of download link.
While Uploading multiple images i was getting error as Maximum request length exceeded but When I increased the size from the Web.Config file now I am getting error as The connection was not closed. The connection's current state is open.
Dont know why.
Please check the code and do let me know where I am mistaken
protected void btnAdd_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile == false)
{
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", "<script>alert('Please select the file.')</script>", false);
}
else
{
foreach (var file in FileUpload1.PostedFiles)
{
string filename = Path.GetFileName(file.FileName);
FileUpload1.SaveAs(Server.MapPath("/GalleryImages/" + filename));
SqlCommand cmd = new SqlCommand("Insert into tbl_gallery_stack(gallery_id, image_title, image_description, image_path) values (#gallery_id,#image_title,#image_description,#image_path)", conn);
cmd.Parameters.AddWithValue("#gallery_id", ddlImagesId.SelectedValue);
cmd.Parameters.AddWithValue("#image_title", txtImageTitle.Text);
cmd.Parameters.AddWithValue("#image_description", txtImageDescription.Text);
cmd.Parameters.AddWithValue("#image_path", filename);
conn.Open();
cmd.ExecuteNonQuery();
BindGrid();
}
}
}
My web.config file code:-
<system.web>
<httpRuntime maxRequestLength="1073741824" />
</system.web>
Latest thing happening
When I upload multiple image, I am not able to view in the gridview. And also in the table the multiple entries get inserted..
See the code:-
<asp:GridView ID="grdGalleryData"
runat="server"
Width="100%" border="1"
Style="border: 1px solid #E5E5E5;"
CellPadding="3"
AutoGenerateColumns="False"
AllowPaging="True"
PageSize="3"
OnPageIndexChanging="grdGalleryData_PageIndexChanging"
CssClass="hoverTable"
DataKeyNames="Id"
>
<AlternatingRowStyle BackColor="#CCCCCC" />
<Columns>
<asp:TemplateField HeaderText="Select" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td">
<ItemTemplate>
<asp:CheckBox ID="chkDelete" runat="server" />
</ItemTemplate>
<HeaderStyle CssClass="k-grid td"></HeaderStyle>
<ItemStyle Width="30px"></ItemStyle>
</asp:TemplateField>
<asp:BoundField DataField="gallery_id" HeaderText="Id" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="image_title" HeaderText="Gallery title" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="image_description" HeaderText="Gallery Description" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td" />
<asp:TemplateField HeaderText="Images" ItemStyle-Width="25" HeaderStyle-CssClass="k-grid td">
<ItemTemplate>
<asp:Image ID="imgDisplay" runat="server" ImageUrl='<%#Getimage(Eval("image_path").ToString()) %>' Width="100px" Height="100px" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Also see the code behind:-
protected void btnAdd_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile == false)
{
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", "<script>alert('Please select the file.')</script>", false);
}
else
{
foreach (var file in FileUpload1.PostedFiles)
{
string filename = Path.GetFileName(file.FileName);
FileUpload1.SaveAs(Server.MapPath("/GalleryImages/" + filename));
SqlCommand cmd = new SqlCommand("Insert into tbl_gallery_stack(gallery_id, image_title, image_description, image_path) values (#gallery_id,#image_title,#image_description,#image_path)", conn);
cmd.Parameters.AddWithValue("#gallery_id", ddlImagesId.SelectedValue);
cmd.Parameters.AddWithValue("#image_title", txtImageTitle.Text);
cmd.Parameters.AddWithValue("#image_description", txtImageDescription.Text);
cmd.Parameters.AddWithValue("#image_path", filename);
conn.Open();
cmd.ExecuteNonQuery();
BindGrid();
conn.Close();
}
}
}
protected string Getimage(string img)
{
if (img != "")
return ("~/GalleryImages/" + img);
else
return ("Images/noimg.gif");
}
BindGrid method
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindDropdownlist();
BindGrid();
}
}
private void BindGrid()
{
string conString = ConfigurationManager.ConnectionStrings["DefaultCSRConnection"].ConnectionString;
SqlCommand cmd = new SqlCommand("Select Id, gallery_id, image_title, image_description, image_path from tbl_gallery_stack order by Id desc");
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlDataAdapter sda = new SqlDataAdapter())
{
cmd.Connection = con;
sda.SelectCommand = cmd;
using (DataTable dt = new DataTable())
{
sda.Fill(dt);
grdGalleryData.DataSource = dt;
grdGalleryData.DataBind();
}
}
}
}
Since you are looping over a collection of files and then inserting data to the database, please instantiate the connection within a using block(so that it would be disposed properly) and also if you want to see all those images uploaded at a time in Grid, then I suggest you move BindGrid() function out of the ForEach loop.
Some sample code below:
foreach (var file in FileUpload1.PostedFiles)
{
try
{
string filename = Path.GetFileName(file.FileName);
file.SaveAs(Server.MapPath("/GalleryImages/" + filename)); //Save each file to disk.
//Also please evaluate you requirement and if you are supposed to loop over relatively
// large collection then you can opt for some batch insert/update of records at-a-go
// instead of calling database multiple times, if your database offer support.
using(var conn = new SqlConnection("YOUR CONNECTION STRING VALUE HERE"))
using(var cmd = new SqlCommand("Insert into tbl_gallery_stack(gallery_id,image_title, image_description, image_path) values (#gallery_id,#image_title,#image_description,#image_path)", conn))
{
cmd.Parameters.AddWithValue("#gallery_id", ddlImagesId.SelectedValue);
cmd.Parameters.AddWithValue("#image_title", txtImageTitle.Text);
cmd.Parameters.AddWithValue("#image_description", txtImageDescription.Text);
cmd.Parameters.AddWithValue("#image_path", filename);
conn.Open();
cmd.ExecuteNonQuery();
}
}
catch(Exception ex) //I suggest you handle all those db/network specific exceptions first
{
//Log the exception details here and either continue over the loop or return based on application requirement.
}
}
BindGrid(); //Assuming you are getting data from database inside this method and binding to Grid.
Also to ensure data integrity it would be better if you move disk file storage logic to end of the loop perhaps setting the entire database & file logic in a try catch block. So that if some error occur in database your disk file also won't be created unmapped.
Hope this may provide some help to your problem.
Close your connection after execute your query.
conn.Open();
cmd.ExecuteNonQuery();
//Close connection
conn.Close();
You're receiving the exception because you never close your connection. An SqlConnection generally can only ever execute one command at a time. Simply add:
conn.Close();
I am trying to use an ashx page as a http handler for images stored in an SQL server database. These Images are to be displayed in a gridview on an aspx page.
<%# WebHandler Language="C#" Class="LinqHandler" %>
using System;
using System.Web;
using System.Drawing.Imaging;
using System.Collections.Generic;
using System.Data.SqlClient;
using System.Configuration;
using System.IO;
public class LinqHandler : IHttpHandler {
public void ProcessRequest(HttpContext context)
{
SqlConnection connect = new SqlConnection();
connect.ConnectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
SqlCommand command = new SqlCommand();
command.CommandText = "SELECT roomID,roomNumber,roomImage1 FROM Rooms "
+ "WHERE roomID = #roomID";
command.CommandType = System.Data.CommandType.Text;
command.Connection = connect;
SqlParameter RoomID = new SqlParameter("#roomID", System.Data.SqlDbType.Int);
RoomID.Value = context.Request.QueryString["roomID"];
command.Parameters.Add(RoomID);
connect.Open();
SqlDataReader dr = command.ExecuteReader();
dr.Read();
context.Response.BinaryWrite((byte[])dr["roomImage1"]);
context.Response.ContentType = "image/gif";
dr.Close();
connect.Close();
}
public bool IsReusable {
get {
return false;
}
}
}
for some reason, the images don't bind to the asp:Image control on the aspx page. I'm stumped as to why.
Here is the databinding snippet:
<asp:GridView ID="GridView1" runat="server"
CssClass="gridviews" PagerStyle-CssClass="pager"
DataKeyNames="roomID" AlternatingRowStyle-CssClass="alt"
AutoGenerateColumns="False" DataSourceID="SqlDataSource1">
<Columns>
<asp:BoundField DataField="roomID" HeaderText="roomID" />
<asp:BoundField DataField="roomNumber" HeaderText="Room Number" />
<asp:TemplateField HeaderText="Image 1">
<ItemTemplate>
<asp:Image runat="server" ID="pic1"
ImageUrl='<%# "~/LinqHandler.ashx?roomID=" + Eval("roomID") %>'>
</asp:Image>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
SelectCommand="SELECT [roomID], [roomNumber], [roomImage1] FROM [Rooms]">
</asp:SqlDataSource>
you can use Handler.ashx for show image. For example:
<img src="Handler.ashx?roomID=1" />
this way you can show image of the one number room.
If you want to do it another way, you can use base64 in css. You dont need to use handler. For example:
<img runat="server" ID="image"/>
//code behind
var bytes = (byte[])dr["roomImage1"]);
var base64String = System.Convert.ToBase64String(bytes, 0, bytes.Length);
image.src = "data:image/gif;base64,"+ base64String;
EDIT:
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
var bytes = (byte[])((DataRow)e.Row.DataItem)["roomImage1"];
var base64String = System.Convert.ToBase64String(bytes, 0, bytes.Length);
var image = (Image)e.Row.FindControl("pic1");
image.ImageUrl = "data:image/gif;base64,"+ base64String;
//or
image.ImageUrl = "LinqHandler.ashx?roomID="+((DataRow)e.Row.DataItem)["roomID"];
}
}
Try as below:
<ItemTemplate>
<asp:Image ID="pic1" runat="server"
ImageUrl='<%# Eval("roomID", "LinqHandler.ashx?roomID={0}") %>'
Height="100px" Width="80px" />
</ItemTemplate>
It turns out that my problems stem from inserting garbage into my SQL BLOB fields. There is nothing wrong with the retrieval mechanism posted in my source code. If you are curious to see the insert statements I used, let me know and I will be glad to post them.