支持图片批量上传
修改删除用ajax技术
Default.aspx 前台代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" Theme="BlackCup" %>
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script type="text/javascript">
var upNum=1;
var check=false;
function checkSelected()
{
var datalist=document.getElementById("<%=dlstImages.ClientID%>");
var chkSelect=false;
var chkList=datalist.getElementsByTagName("input");
for(var i=0;i<chkList.length;i++)
{
if(chkList[i].checked==true)
{
chkSelect=true;
break;
}
}
if(chkSelect==false)
{
alert("你没有选择任何图片");
return false;
}
else
{
return confirm("你确定删除这些图片吗?");
}
}
function editName()
{
div1.style.display="";
var lbl=document.getElementById("sp1");
lbl.style.display="none";
return false;
}
function openImage(img)
{
window.open(img,'img','height=700, width=500, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=yes,location=no, status=no');
}
function addImage()
{
upNum++;//限制上传数量
if(upNum<5)
{
var str = '<input type="file" size="20" name="File" onpropertychange="checkImgType(this)" /><br>'
document.getElementById('MyFile').insertAdjacentHTML("beforeEnd",str)
}
else
{
alert("最多上传4张图片");
}
}
function checkImgType(obj)
{
var file=obj.value;
var index=file.lastIndexOf(".")
var exten=file.substr(index);
var strlower=exten.toLowerCase();
switch(strlower)
{
case ".jpg":
check=true;
break;
case ".jpeg":
check=true;
break;
case ".bmp":
check=true;
break;
case ".png":
check=true;
break;
case ".gif":
check=true;
break;
}
if(!check)
{
alert("上传图片类型不正确");
}
}
function checktype()
{
if(!check)
{
alert("上传图片类型不正确");
return false;
}
else
return true;
}
</script>
<link href="LucaStyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server" enctype="multipart/form-data">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:Label
id="lblImageFile"
Text="图片文件:"
Runat="server" />
<div id="MyFile">
<input type="file" name="file" onpropertychange="checkImgType(this)"/> <input id="Button2" type="button" value="上传更多" onclick="addImage()" /><br /></div>
<br />
<asp:Button
id="btnAdd"
Text="上传图片"
OnClick="btnAdd_Click"
Runat="server" OnClientClick="return checktype()" />
<asp:Button ID="Button1" runat="server" Text="删除图片" OnClientClick="return checkSelected()" OnClick="Button1_Click" />
<asp:Label ID="lblMessage" runat="server" BackColor="White" ForeColor="Red"></asp:Label>
<hr />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DataList
id="dlstImages"
RepeatColumns="3"
runat="server" DataKeyField="Name" OnDeleteCommand="dlstImages_DeleteCommand" OnEditCommand="dlstImages_EditCommand" OnCancelCommand="dlstImages_CancelCommand" OnUpdateCommand="dlstImages_UpdateCommand">
<ItemTemplate>
<img id="img1" src="<%#ResolveUrl(FormatImagePath(Eval("Name"))) %>" style="width:200px;height:200px" onclick="javascript:openImage('<%#ResolveUrl(FormatImagePath(Eval("Name"))) %>')"/>
<br />
<div style="float:left">
<asp:Label ID="lblName" runat="server" Text='<%#FormatImageName(Eval("Name"),"0") %>' ></asp:Label>
<asp:HiddenField ID="hidFileType" runat="server" Value='<%#FormatImageName(Eval("Name"),"1") %>' />
</div>
<div style="float:right">
<asp:LinkButton ID="lbnEdit" runat="server" Text="修改" CommandName="Edit"></asp:LinkButton>
<asp:LinkButton ID="lbnDel" runat="server" Text="删除" CommandName="Delete" OnClientClick="return confirm('你确认删除吗?')"></asp:LinkButton>
<asp:CheckBox ID="chk1" runat="server" />
</div>
</ItemTemplate>
<ItemStyle Width="250px" HorizontalAlign="Center" BorderColor="black" BorderStyle="Solid" BorderWidth="1px" />
<EditItemTemplate>
<asp:TextBox ID="txt1" runat="server" Text='<%#FormatImageName(Eval("Name"),"0") %>'></asp:TextBox>
<asp:HiddenField ID="hidFileType" runat="server" Value='<%#FormatImageName(Eval("Name"),"1") %>' />
<asp:LinkButton ID="lbnUpdate" runat="server" Text="更新" CommandName="Update"></asp:LinkButton>
<asp:LinkButton ID="lbnCancel" runat="server" Text="取消" CommandName="Cancel"></asp:LinkButton>
</EditItemTemplate>
</asp:DataList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" />
</Triggers>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
后台代码
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.IO;
public partial class _Default : System.Web.UI.Page
{ protected void Page_Load(object sender, EventArgs e)
{}
protected void btnAdd_Click(object sender, EventArgs e)
{
//获取上传文件集合
HttpFileCollection uploadedFiles = Request.Files;
for (int i = 0; i < uploadedFiles.Count; i++)
{
HttpPostedFile userFile = uploadedFiles[i];
try
{
if (userFile.ContentLength > 0)
{
if (CheckFileType(userFile.FileName))
{
//获取登录名
string userName = HttpContext.Current.User.Identity.Name;
//为每个用户创建一个文件夹存图片
String filePath = Server.MapPath("~/UploadImages/" + userName + "/");
DirectoryInfo dire = new DirectoryInfo(filePath);
if (!dire.Exists)
dire.Create();
//获取上传文件名
string fName=System.IO.Path.GetFileName(userFile.FileName);
//获取后缀名
//string fExtension=System.IO.Path.GetExtension(userFile.FileName);
userFile.SaveAs(filePath + fName);
}
}
}
catch
{
lblMessage.Text += String.Format("上传文件:{0}出错!<br/>",userFile.FileName.ToString());
}
}}
//判断图片类型
bool CheckFileType(string fileName)
{
string ext = Path.GetExtension(fileName);
switch (ext.ToLower())
{
case ".gif":
return true;
case ".png":
return true;
case ".jpg":
return true;
case ".jpeg":
return true;
case ".bmp":
default:
return false;
}
}
//所有加载完成后执行
void Page_PreRender()
{
string userName = HttpContext.Current.User.Identity.Name;
string upFolder = MapPath("~/UploadImages/" + userName + "/");DirectoryInfo dir
= new DirectoryInfo(upFolder);
if (!dir.Exists)
return;
dlstImages.DataSource = dir.GetFiles();
dlstImages.DataBind();}
protected void Button1_Click(object sender, EventArgs e)
{
//批量删除
FileInfo file = null;
string userName = HttpContext.Current.User.Identity.Name;
for (int i = 0; i < dlstImages.Items.Count; i++)
{
CheckBox chk = dlstImages.Items[i].FindControl("chk1") as CheckBox;
if (chk.Checked == true)
{
string path = Server.MapPath("~/UploadImages/"+userName+"/" + dlstImages.DataKeys[i].ToString());
file = new FileInfo(path);
file.Delete();
}
}}
//组合图片完成路径
protected string FormatImagePath(object imageName)
{
string userName = HttpContext.Current.User.Identity.Name;
string imagePath = "~/UploadImages/" + userName + "/" + imageName;
return imagePath;
}
//前台显示隐藏后缀名
protected string FormatImageName(object imgName,string filetype)
{
//隐藏后缀名
if (filetype == "0")
{
string strImgName = imgName.ToString();
return strImgName.Substring(0, strImgName.LastIndexOf('.'));
}
//显示后缀名
else
{
string type=System.IO.Path.GetExtension(imgName.ToString());
return type;
}}
protected void dlstImages_DeleteCommand(object source, DataListCommandEventArgs e)
{
string userName = HttpContext.Current.User.Identity.Name;
string path = Server.MapPath("~/UploadImages/"+userName+"/" +dlstImages.DataKeys[e.Item.ItemIndex].ToString());
FileInfo file = new FileInfo(path);
file.Delete();
}
protected void dlstImages_EditCommand(object source, DataListCommandEventArgs e)
{
dlstImages.EditItemIndex = e.Item.ItemIndex;
}
protected void dlstImages_UpdateCommand(object source, DataListCommandEventArgs e)
{
string userName = HttpContext.Current.User.Identity.Name;
string path = Server.MapPath("~/UploadImages/"+userName+"/" + dlstImages.DataKeys[e.Item.ItemIndex].ToString());
FileInfo file = new FileInfo(path);
string fileName=(dlstImages.Items[e.Item.ItemIndex].FindControl("txt1"
作者: chisel
- 该日志由 chisel 于12年前发表在综合分类下,最后更新于 2012年10月26日.
- 转载请注明: 图片上传及网络相册功能 | 学步园 +复制链接
抱歉!评论已关闭.