How to create Image Gallery
in Asp.Net using DataList Control (without using any Database)
Note: In this topic we are discussing how to save image in
Image Folder which exits in Website without using any Database and you cannot
insert and update duplicate image in Image folder
Code for Default4.aspx……………………………………..
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default4.aspx.cs" Inherits="Default4" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1 {
height: 23px;
}
.auto-style2 {
width: 150px;
}
.auto-style3 {
height: 23px;
width: 150px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table width="100%">
<tr>
<td colspan="2"><b><font color="Red">How to create Image
Gallery in Asp.Net using DataList Control</font></b></td>
</tr>
<tr>
<td class="auto-style2">Upload Picture</td>
<td>
<asp:FileUpload ID="FileUpload1" runat="server" />
</td>
</tr>
<tr>
<td class="auto-style2"></td>
<td>
<asp:Button ID="btnSaveImage" runat="server" OnClick="btnSaveImage_Click" Text="Save
Image"
Width="135px" />
</td>
</tr>
<tr>
<td class="auto-style3"></td>
<td class="auto-style1">
<asp:Label ID="lblmessage" runat="server" Text="Label" Visible="False"></asp:Label>
</td>
</tr>
<tr>
<td colspan="2"><b><font color="Green">Show all Image in
DataList Control</font></b></td>
</tr>
<tr>
<td colspan="2">
<asp:DataList ID="DataList1" runat="server" OnItemCommand="DataList1_ItemCommand" RepeatColumns="3">
<ItemTemplate>
<table>
<tr><td><asp:Image ID="Image1" runat="server" Height="144px" ImageUrl='<%# Eval("image","~/image/{0}") %>' Width="168px" /></td></tr>
<tr><td><asp:Label ID="Label1" runat="server" Text='<%# Eval("name") %>'></asp:Label></td></tr>
<tr><td><asp:LinkButton ID="lbdelete" runat="server" CommandName="Delete">Delete</asp:LinkButton>
<asp:LinkButton ID="lbedit" runat="server" CommandName="Edit">Edit</asp:LinkButton>
<asp:LinkButton ID="lbcancel" runat="server" Visible="False" CommandName="Cancel">Cancel</asp:LinkButton>
<asp:LinkButton ID="lbupdate" runat="server" CommandName="Update" Visible="False">Update</asp:LinkButton>
</td></tr>
<tr><td>
<asp:FileUpload ID="FileUpload2" runat="server" Visible="False" Width="198px" />
</td></tr>
<tr><td>
<asp:Label ID="lblmsg" runat="server" Text="Label" Visible="False"></asp:Label>
</td></tr>
</table>
</ItemTemplate>
</asp:DataList>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Code for Default4.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.Drawing;
public partial class Default4 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
BindDataList();
}
}
//create class with property
..................
public class c
{
public string image { get; set; }
public string name { get; set; }
}
//code for bind DataList
Control..............................
private void BindDataList()
{
DirectoryInfo d = new DirectoryInfo(Server.MapPath("image"));
var v =
d.GetFiles().Select(m => new c { image = Path.GetFileName(m.FullName), name = Path.GetFileNameWithoutExtension(m.FullName)
}).ToList();
DataList1.DataSource = v;
DataList1.DataBind();
}
//code for how to save image
in Website Folder................
protected void btnSaveImage_Click(object sender, EventArgs e)
{
if
(FileUpload1.HasFile)
{
DirectoryInfo dd1 = new DirectoryInfo(Server.MapPath("~/Image/"));
FileInfo[] f =
dd1.GetFiles();
int i = 0;
if (f != null)
{
foreach (FileInfo ff in f)
{
if (ff.Name ==
FileUpload1.FileName)
{
i = 1;
break;
}
}
}
if (i == 0)
{
FileUpload1.SaveAs(Server.MapPath("~/Image/") +
FileUpload1.FileName);
lblmessage.Visible = true;
BindDataList();
lblmessage.ForeColor = Color.Green;
lblmessage.Text = "Image save
successfully";
}
else
{
lblmessage.Visible = true;
lblmessage.ForeColor = Color.Red;
lblmessage.Text = "Image
allready exist please upload another Image";
return;
}
}
else
{
lblmessage.Visible = true;
lblmessage.ForeColor = Color.Red;
lblmessage.Text = "Please
upload image ";
}
}
//code for how to
delete,update,cancel from DataList Control................
protected void DataList1_ItemCommand(object source, DataListCommandEventArgs e)
{
DirectoryInfo dd = new DirectoryInfo(Server.MapPath("~/Image/"));
FileUpload fu= (FileUpload)e.Item.FindControl("FileUpload2");
Label ll = (Label)e.Item.FindControl("lblmsg");
//because
System.Web.UI.WebControls and System.Drawing both have same Class Image
System.Web.UI.WebControls.Image im =
(System.Web.UI.WebControls.Image)e.Item.FindControl("Image1");
LinkButton lbe = (LinkButton)e.Item.FindControl("lbedit");
LinkButton lbc = (LinkButton)e.Item.FindControl("lbcancel");
LinkButton lbu = (LinkButton)e.Item.FindControl("lbupdate");
LinkButton lbd = (LinkButton)e.Item.FindControl("lbdelete");
if (e.CommandName == "Delete")
{
File.Delete(Server.MapPath(im.ImageUrl));
BindDataList();
}
if (e.CommandName == "Update")
{
if (fu.HasFile)
{
FileInfo[] f1 = dd.GetFiles();
int j = 0;
if (f1 != null)
{
foreach (FileInfo ff in f1)
{
if (ff.Name ==
fu.FileName)
{
j = 1;
break;
}
}
}
if (j == 0)
{
File.Delete(Server.MapPath(im.ImageUrl));
fu.SaveAs(Server.MapPath("~/Image/") + fu.FileName);
BindDataList();
return;
else
{
ll.Visible = true;
ll.ForeColor = Color.Red;
ll.Text = "Image
allready exist ";
return;
}
}
else
{
ll.Visible = true;
ll.ForeColor = Color.Red;
ll.Text = "Please
upload image ";
}
}
if (e.CommandName == "Edit")
{
lbc.Visible = true;
lbu.Visible = true;
lbd.Visible = false;
lbe.Visible = false;
fu.Visible = true;
fu.Width = 150;
im.Height = 100;
}
if (e.CommandName == "Cancel")
{
lbc.Visible = false;
lbe.Visible = true;
lbd.Visible = true;
im.Height = 144;
fu.Visible = false;
lbu.Visible = false;
ll.Visible = false;
}
}
}
Result:
Thank u sir...
ReplyDeleteIt is really very excellent,i find all articles was amazing.awesome way to get exert tips from everyone,not only i like that post all peoples like that post,because of all given information was wonderful and it's very helpful for me.
ReplyDeleteDot Net Course in Chennai
Testing Courses in Chennai
Java Course and Certification
PHP Training Institutes