I want to ask user for the image of car and its details, then store that details in a "tblCarDetails" and retrieve them into repeater control and showing all images in that, when user clicks on that image then it will go to another page which having a details list controller there we are showing that specific car details.
1. Converting image to binary.
2. Storing that binary data into database.
3. Retrieve that binary data into image control and show in repeater by binding that data.
This code is used for Inserting Car Data with Image into Database and retrieving detais and showing into repeter control
InsertCarDetails.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="InsertCarDetails.aspx.cs" Inherits="InsertCarDetails" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Add Car Details</title>
<style type="text/css">
/*body{
font-family:Tahoma;
padding:5px;
margin:5px;
}*/
#form1 {
max-width: 400px;
height: 400px;
padding: 40px 50px;
border: 2px solid gray;
border-radius: 10px;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
background-color: #fff;
align-content: center;
display: inline-block;
}
h2 {
background-color: #FEFFED;
padding: 20px 35px;
margin: -10px -50px;
text-align: center;
border-radius: 10px 10px 0 0;
}
hr {
margin: 10px -50px;
border: 0;
border-top: 1px solid #CCC;
}
.txt {
width: 55%;
padding: 4px;
margin-top: 10px;
border: 1px solid #CCC;
padding-left: 20px;
font-size: 16px;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
#btnSave,
#btnreset {
text-decoration: none;
width: 90%;
text-align: center;
display: block;
background-color: #FFBC00;
color: #FFF;
border: 1px solid #FFCB00;
padding: 5px 0;
font-size: 20px;
cursor: pointer;
border-radius: 5px;
margin-top: 15px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<div align="center">
<br />
<asp:Label ID="lblStatus" runat="server"></asp:Label>
<br />
<div id="mainDiv">
<h2>Add Car Details</h2>
<hr />
<table>
<tr>
<td>CID </td>
<td>
<asp:TextBox ID="txtCid" runat="server" CssClass="txt"></asp:TextBox>
</td>
</tr>
<tr>
<td>Car Name</td>
<td>
<asp:TextBox ID="txtCName" runat="server" CssClass="txt"></asp:TextBox>
</td>
</tr>
<tr>
<td>Company</td>
<td>
<asp:TextBox ID="txtCompany" runat="server" CssClass="txt"></asp:TextBox>
</td>
</tr>
<tr>
<td>Color</td>
<td>
<asp:TextBox ID="txtColor" runat="server" CssClass="txt"></asp:TextBox>
</td>
</tr>
<tr>
<td>Price</td>
<td>
<asp:TextBox ID="txtPrice" runat="server" CssClass="txt"></asp:TextBox>
</td>
</tr>
<tr>
<td>Car Image</td>
<td>
<asp:FileUpload ID="ImageUpload" runat="server" />
</td>
</tr>
<tr>
<td colspan="2">
<asp:Button ID="btnSave" runat="server" Text="save" OnClick="btnSave_Click" />
<asp:Button ID="btnreset" runat="server" Text="reset" OnClick="btnreset_Click" />
</td>
</tr>
</table>
</div>
</div>
</div>
</form>
</body>
</html>InsertCarDetails.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
public partial class InsertCarDetails: System.Web.UI.Page
{
SqlConnection cn = null;
protected void Page_Load(object sender, EventArgs e)
{}
protected void btnSave_Click(object sender, EventArgs e)
{
cn = new SqlConnection(ConfigurationManager.ConnectionStrings["conStr"].ConnectionString);
cn.Open();
string fileName = string.Empty;
string filePath = string.Empty;
Byte[] bytes;
FileStream fs;
BinaryReader br;
if (ImageUpload.HasFile)
{
fileName = ImageUpload.FileName;
filePath = Server.MapPath("CarImages/" + fileName);
ImageUpload.SaveAs(filePath);
fs = new FileStream(filePath, FileMode.Open, FileAccess.Read);
br = new BinaryReader(fs);
bytes = br.ReadBytes(Convert.ToInt32(fs.Length));
br.Close();
fs.Close();
SqlCommand cmd = new SqlCommand("InsertCarDetails_SP", cn);
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@cid", txtCid.Text.Trim());
cmd.Parameters.AddWithValue("@cname", txtCName.Text.Trim());
cmd.Parameters.AddWithValue("@commpany", txtCompany.Text.Trim());
cmd.Parameters.AddWithValue("@color", txtColor.Text.Trim());
cmd.Parameters.AddWithValue("@price", txtPrice.Text.Trim());
cmd.Parameters.AddWithValue("@imagename", fileName);
cmd.Parameters.AddWithValue("@image", bytes);
if (cmd.ExecuteNonQuery() > 0)
{
lblStatus.Text = "Record Is Saved!!!!!";
btnrese();
}
}
}
void btnrese()
{
txtCid.Text = txtCName.Text = txtColor.Text = txtCompany.Text = txtPrice.Text = string.Empty;
}
protected void btnreset_Click(object sender, EventArgs e)
{
btnrese();
}
}CarRepeterExample1.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CarRepeterExample1.aspx.cs" Inherits="CarRepeterExample1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Repeater ID="rpCar" runat="server">
<ItemTemplate> <a href="CarDetails.aspx?cid='<%# Eval(" CID ") %>'">
<img src='data:CarImages/jpg;base64,<%# Eval("image") != System.DBNull.Value ? Convert.ToBase64String((byte[])Eval("image")) : string.Empty %>'alt="image" height="200" width="300" style="border:5px solid black" />
</a> </ItemTemplate>
</asp:Repeater>
<asp:Label ID="lblStatus" runat="server"></asp:Label>
</div>
</form>
</body>
</html>CarRepeterExample1.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
public partial class CarRepeterExample1: System.Web.UI.Page
{
SqlConnection cn;
SqlCommand cmd;
DataSet ds;
SqlDataAdapter da = null;
protected void Page_Load(object sender, EventArgs e)
{
cn = new SqlConnection(ConfigurationManager.ConnectionStrings["conStr"].ConnectionString);
if (!Page.IsPostBack)
{
BindData();
}
}
void BindData()
{
if (cn.State != ConnectionState.Open) cn.Open();
da = new SqlDataAdapter("Select * from tblCarDetails", cn);
ds = new DataSet();
da.Fill(ds, "tblCarDetails");
rpCar.DataSource = ds;
rpCar.DataBind();
}
}