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拍照上传后会倒置等诸多问题 ...
随机推荐
- codevs1040 统计单词个数
题目描述 Description 给出一个长度不超过200的由小写英文字母组成的字母串(约定;该字串以每行20个字母的方式输入,且保证每行一定为20个).要求将此字母串分成k份(1<k<= ...
- Easy UI treegrid 分页实例
转自:http://www.jeasyuicn.com/jquery-easyui-treegird-page-processing.html
- [Linux]shell编程基础/linux基础入门
声明执行程序 #!/bin/bash 用来告诉系统使用/bin/bash 程序来执行该脚本.譬如python 脚本,可以这样写: #!/usr/bin/python 赋值和引用 赋值公式: 变量名 ...
- 在PHP中处理表单之—Checkbox
原文翻译自:http://www.html-form-guide.com/php-form/php-form-checkbox.html 单个checkbox 形如: <form action ...
- poj 1050 To the Max_dp求最大子矩阵和
题意:求最大子矩阵和 利用dp[i]每次向下更新,构成竖起的单条矩阵,再按不小于零就加起来来更新,构成更大的矩阵 #include <iostream> #include<cstdi ...
- c++崩溃错误2
使用了内联函数: 在头文件中声明和定义内联函数是正确的 但是在头文件中声明内联函数,而在.cpp文件中定义了内联函数会导致崩溃的 .h class stu{ inline void str(): } ...
- 浅析C# 中object sender与EventArgs e (转)
一.了解C#中的预定义事件处理机制 在写代码前我们先来熟悉.net框架中和事件有关的类和委托,了解C#中预定义事件的处理. EventArgs是包含事件数据的类的基类,用于传递事件的细节. Ev ...
- SQL Server中的sysobjects
摘自:http://www.cnblogs.com/bugY/archive/2011/09/21/2184182.html 关于SQL Server数据库的一切信息都保存在它的系统表格里.我怀疑你是 ...
- 【线段树成段更新-模板】【HDU1698】Just a Hook
题意 Q个操作,将l,r 的值改为w 问最后1,n的sum 为多少 成段更新(通常这对初学者来说是一道坎),需要用到延迟标记(或者说懒惰标记),简单来说就是每次更新的时候不要更新到底,用延迟标记使得更 ...
- document.createElement()的用法
今天做项目需要做个添加地址栏和前面需要一个按钮,就看到了这篇文章! document.createElement()是在对象中创建一个对象,要与appendChild() 或 insertBefore ...