asp.net多图片上传同时保存对每张图片的描述
前台aspx
//图片预览和描述
function previewImage(file) {
var div = document.getElementById('preview');
div.innerHTML = "";
for (var i = 0; i < file.files.length; i++) {
//alert(file.files[i]);
var ndiv = document.createElement("div");
ndiv.style.height = "150px";
ndiv.style.width = "300px";
ndiv.style.cssFloat = "left";
var img = document.createElement("img");
var textArea = document.createElement("textarea");
textArea.style.width = "100";
textArea.style.height = "60px";
textArea.setAttribute("name", "note"+i);//给填写备注的控件一个名字,和图片数量关联
ndiv.appendChild(img);
ndiv.appendChild(textArea);
img.id = "img" + i;
div.appendChild(ndiv);
img.width = 200;
img.height = 200;
}
for (var i = 0; i < file.files.length; i++) {
var pic = document.getElementById("img" + i);
pic.src = window.URL.createObjectURL(file.files[i]);
}
}
<form id="form1" method="post" runat="server" enctype="multipart/form-data">
<div style="text-align: center">
<div>
<h3>车辆图片上传</h3>
<input type="file" multiple="multiple" onchange="previewImage(this)" id="myimage" runat="server" class="btn btn-default" style="margin-left: 40%; height: 69px; width: 280px" />
<p id="MyFile">
<asp:Button runat="server" Text="确认返回" OnClick="Unnamed_Click" CssClass="btn btn-default" Height="68px" Width="124px" />
<asp:Button runat="server" Text="开始上传" ID="UploadButton" OnClick="UploadButton_Click" CssClass="btn btn-default" Height="69px" Width="129px"></asp:Button>
</p>
<p>
<asp:Label ID="strStatus" runat="server" Font-Names="宋体" Font-Bold="True" Font-Size="9pt" Width="500px"
BorderStyle="None" BorderColor="White"></asp:Label>
</p>
</div>
<%-- 图片预览 --%>
<div id="preview">
</div>
</div>
</form>
后台cs
private void SaveImages()
{
///遍历File表单元素
HttpFileCollection files = HttpContext.Current.Request.Files;
/// 状态信息
System.Text.StringBuilder strMsg = new System.Text.StringBuilder();
strMsg.Append("上传的文件分别是:<hr color=red>");
try
{
for (int iFile = 0; iFile < files.Count; iFile++)
{
string note= Request["note"+iFile];//获取每张图片的描述内容
string fileName = files[iFile].FileName;
string path = Server.MapPath("~/upload/");
string imgType = files[iFile].ContentType.ToString(); // 图片类型
if (fileName != "" && (imgType.Equals("image/bmp") || imgType.Equals("image/jpg") || imgType.Equals("image/jpeg") || imgType.Equals("image/gif") || imgType.Equals("image/png")))
{
string upPath = FileController.GetUpPath();
fileName = iFile + "_" + fileName;
string path2 = Server.MapPath("~/upload/");
//生成原图
Byte[] oFileByte = new byte[files[iFile].ContentLength];
System.IO.Stream oStream = files[iFile].InputStream;
System.Drawing.Image oImage = System.Drawing.Image.FromStream(oStream);
int oWidth = oImage.Width; //原图宽度
int oHeight = oImage.Height; //原图高度
int tWidth = 100; //设置缩略图初始宽度
int tHeight = 100; //设置缩略图初始高度
int add1 = 20;
int add2 = 120;
Graphics g = null;
Bitmap tImage = null;
string fileExtension = System.IO.Path.GetExtension(fileName);
strMsg.Append("上传的文件类型:" + files[iFile].ContentType.ToString() + "<br>");
strMsg.Append("客户端文件地址:" + files[iFile].FileName + "<br>");
strMsg.Append("上传文件的文件名:" + fileName + "<br>");
strMsg.Append("上传文件的扩展名:" + fileExtension + "<br><hr>");
for (int i = 0; i < 4; i++)
{
//按比例计算出缩略图的宽度和高度
if (oWidth >= oHeight)
{
tHeight = (int)Math.Floor(Convert.ToDouble(oHeight) * (Convert.ToDouble(tWidth) / Convert.ToDouble(oWidth)));
}
else
{
tWidth = (int)Math.Floor(Convert.ToDouble(oWidth) * (Convert.ToDouble(tHeight) / Convert.ToDouble(oHeight)));
}
//生成缩略原图
tImage = new Bitmap(tWidth, tHeight);
g = Graphics.FromImage(tImage);
g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.High; //设置高质量插值法
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;//设置高质量,低速度呈现平滑程度
g.Clear(Color.Transparent); //清空画布并以透明背景色填充
g.DrawImage(oImage, new Rectangle(0, 0, tWidth, tHeight), new Rectangle(0, 0, oWidth, oHeight), GraphicsUnit.Pixel);
string savePath2 = path + files[iFile].FileName;
string savePath = "~/upload/" + "(" + tWidth + "-" + tHeight + ")" + fileName;
try
{
//以JPG格式保存图片
//oImage.Save(oFullName, System.Drawing.Imaging.ImageFormat.Jpeg);
tImage.Save(path2 + "(" + tWidth +"-"+ tHeight + ")" + fileName, System.Drawing.Imaging.ImageFormat.Jpeg);
//保存图片路径到数据库
inv_worklistInfo inv_wlInfo = new inv_worklistInfo();
inv_wlInfo.picurl = savePath;
inv_wlInfo.workid = workid;
inv_wlInfo.notes = note;
inv_worklistFactory.Create().Add(inv_wlInfo);
}
catch (Exception ex)
{
strStatus.Text = ex.Message;
}
if (i == 0)
{
tWidth = 100 + add1; //设置缩略图初始宽度
tHeight = 100 + add1; //设置缩略图初始高度
}
if (i == 1)
{
tWidth = 100 + add2; //设置缩略图初始宽度
tHeight = 100 + add2; //设置缩略图初始高度
}
if (i == 2)
{
tWidth = oWidth; //设置缩略图初始宽度
tHeight = oHeight; //设置缩略图初始高度
}
}
////释放资源
if (!CmpUtil.IsNullOEmp(oImage))
{
oImage.Dispose();
}
if (!CmpUtil.IsNullOEmp(g))
{
g.Dispose();
}
if (!CmpUtil.IsNullOEmp(tImage))
{
tImage.Dispose();
}
}
else
{
JSController.Alert(this, "图片格式只支持:jpeg,jpg,png,bmp,gif");
}
}
strStatus.Text = strMsg.ToString();
}
catch (System.Exception Ex)
{
strStatus.Text = Ex.Message;
}
}
}
asp.net多图片上传同时保存对每张图片的描述的更多相关文章
- 在ASP.NET MVC下实现单个图片上传, 客户端服务端双重限制图片大小和格式, 服务端裁剪图片
在"MVC文件图片ajax上传轻量级解决方案,使用客户端JSAjaxFileUploader插件01-单文件上传"一文中,使用JSAjaxFileUploader这款插件实现了单文 ...
- 配置django图片上传与保存展示
近来在研究django,发现有好多好玩的功能,比如图片上传,以前处理这个比较麻烦,现在我们来看看如何来处理图片上传与保存 1.在数据库设计的时候需要配置upload_to image = models ...
- java多图片上传--前端实现预览--图片压缩 、图片缩放,区域裁剪,水印,旋转,保持比例。
java多图片上传--前端实现预览 前端代码: https://pan.baidu.com/s/1cqKbmjBSXOhFX4HR1XGkyQ 解压后: java后台: <!--文件上传--&g ...
- jsp+springmvc实现文件上传、图片上传和及时预览图片
1.多文件上传:http://blog.csdn.net/a1314517love/article/details/24183273 2.单文件上传的简单示例:http://blog.csdn.net ...
- thinkphp图片上传+validate表单验证+图片木马检测+缩略图生成
目录 1.案例 1.1图片上传 1.2进行图片木马检测 1.3缩略图生成 1.4控制器中调用缩略图生成方法 1.案例 前言:在thinkphp框架的Thinkphp/Library/Thin ...
- layui图片上传之后后台如何修改图片的后缀名以及返回数据给前台
const pathLib = require('path');//引入node.js下的一个path模块的方法,主要处理文件的名字等工作,具体可看文档 const fs = require(''fs ...
- 前台图片上传展示JS(单张图片展示)
<script type="text/javascript"> //下面用于多图片上传预览功能 function setImagePreviews(aval ...
- input type=file实现图片上传,预览以及图片删除
背景 前两天在做一个PC网站的意见反馈,其中涉及到了图片上传功能,要求可以上传多张图片,并且支持图片上传预览及图片删除, 图片上传这一块以前没怎么搞过,而且一般也很少会碰到这样的需求,所以在做这个功能 ...
- 图片上传前 压缩,base64图片压缩 Exif.js处理ios拍照倒置等问题
曾写过在前端把图片按比例压缩不失真上传服务器的前端和后台,可惜没有及时做总结保留代码,只记得js利用了base64位压缩和Exif.js进行图片处理,还有其中让我头疼的ios拍照上传后会倒置等诸多问题 ...
随机推荐
- JS:函数多个参数默认值指定
函数有一个参数时,以往这样定义(参数为p1): function mfun(p1){ … } 当需要为p1设定一个默认值时 function mfun(p1){ if(p1===undefined) ...
- Linux中Samba详细安装
为了实现Windows主机与Linux服务器之间的资源共享,Linux操作系统提供了Samba服务,Samba服务为两种不同的操作系统架起了一座桥梁,使Linux系统和Windows系统之间能够实现互 ...
- 利用COM组件IPicture读取jpg、gif、bmp图片文件数据和显示图片
1.读取图片数据 函数原型:bool LoadImage(const char *pName, unsigned char *pBitData); 函数功能,读取pName指向的图片文件的位图数据 b ...
- C#尝试读取或写入受保护的内存。这通常指示其他内存已损坏。
安装VS2013后,win7 + .net 4 + c#程序无法连接到SQL Server2000的实例 SQLServer2012在登录远程服务器实例时报错:尝试读取或写入受保护的内存. “尝试读取 ...
- sql 2000 "无法执行查询,因为一些文件缺少或未注册"的
sql 2000 "无法执行查询,因为一些文件缺少或未注册"的解决办法 在SQL server 2000中打开表查看数据的时候,提示说“无法执行查询,因为一些文件缺少或未注册” 用 ...
- Curly braces in Python in 2012? - Stack Overflow
Curly braces in Python in 2012? - Stack Overflow Curly braces in Python in 2012? [closed]
- OAuth2.0认证介绍
OAuth2.0鉴权 返回 目录 [隐藏] 1 腾讯微博OAuth2.0认证介绍 2 获取accesstoken的两种方式 2.1 1.Authorization code grant 2.1.1 第 ...
- 如何使用Storyboard创建UIPageViewController
之前我们已经讲过UIPageViewController,那篇文章演示了如何使用Interface Builder创建UIPageViewController.为了适配iOS7和Xcode5,我们重新 ...
- idea git merge代码
1.点击idea 右下角的红框区域 2.出现如下截图,第一个红框是本地dev merge,也就是说可以从从本地的dev仓库merge,第二个红框表明可以从远程的git dev merge 第三个红框表 ...
- UVA 10305 Ordering Tasks
题意: 给出n和m,n代表总共有几个箱子.接下来m行,每行有a,b,表示b在a之后.输出一个合理的序列. 分析: 简单的拓扑排序: 代码: #include <iostream>#incl ...