在nuget控制台输入:Install-Package dropzone

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<link href="~/Scripts/dropzone/dropzone.min.css" rel="stylesheet" />
<script src="~/Scripts/dropzone/dropzone.min.js"></script>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
</head>
<body>
<div class="container">
<header>
<div class="row"> <div class="col-md-9 text-right"></div>
</div>
</header>
<div class="row main" style="min-height:500px">
<div class="col-md-12"> <div class="row" style="margin-top:30px;">
<div class="col-md-3 col-xs-12 col-md-offset-3">
@*<form id="mydropzone" action="/sss/upload" class="dropzone"></form>*@
<div id="mydropzone" class="dropzone"></div>
</div>
</div>
</div>
</div> <footer> </footer>
</div> <script>
var myDropzone = new Dropzone("div#mydropzone", {
url: "@Url.Action("update","controller")",
paramName: "file",
maxFilesize: 100, // MB
maxFiles: 5,
acceptedFiles: ".jpg,.png,.gif",
success: function (data) {
alert(data);
},
dictDefaultMessage: "点击上传图片",
dictInvalidInputType: "请选择格式为jpg,png,gif格式的图片", addRemoveLinks: true,
dictRemoveFile: "移 除",
init: function () { this.on("removedfile", function (file) {
debugger;
$.ajax({
type:"post",
url:"/sss/delete",
data:JSON.stringify({ id: file.name }),
contentType:"application/json;charset=utf-8",
success: function (data) {
if (data > 1)
{
alert("删除成功!!");
}
} }); });
} });
</script>
</body>
</html>

  

 public class sssController : Controller
{ public string path;
// GET: sss
public ActionResult Index()
{
return View();
}
[HttpPost]
public ActionResult upload() {
HttpFileCollectionBase coll = Request.Files;
string fileName = "";
string fileExtension = "";
string filePath = ""; foreach (string item in coll)
{
HttpPostedFileBase file = Request.Files[item];
if (file != null && file.ContentLength > 0)
{
fileName = file.FileName;
fileExtension = Path.GetExtension(fileName);
filePath =Server.MapPath("/Content/photo/")+fileName;
path = filePath;
file.SaveAs(filePath);
}
}
return Json("ok");
}
[HttpPost]
public ActionResult delete(string id)
{
string filePath = Path.Combine(Server.MapPath("/Content/photo"), id);
int res = 0;
if (System.IO.File.Exists(filePath))
{
System.IO.File.Delete(filePath);
res = 10;
}
return Json(res); }
}

  

.NET MVC Dropzone 上传图片的更多相关文章

  1. spring mvc 的上传图片是怎么实现的?

    spring mvc 的上传图片是怎么实现的? 导入jar包,commons-io.jar 及 commons-fileupload.jar 在springmvc的配置文件中配置Mutipart解析器 ...

  2. mvc实现上传图片(上传和预览)webuploader

    笔者看到mvc最近比较流行,而很多使用一些比较旧的的方法上传图片,再次安利一下百度的webuploader控件吧 webuploader第一步要先下载一些插件这点可以在webuploader官网上下载 ...

  3. ASP.NET MVC 4 - 上传图片到数据库

    这里演示如何在MVC WEB应用程序如何上传图片到数据库以及如何在WEB页面上显示图片.数据库表对应整个Model类,不单图片数据一个字段,我们从数据表的定义开始: CREATE TABLE [dbo ...

  4. MVC异步上传图片到本地/服务器

    这两天朋友问我,有没有异步上传图片到本地/服务器这种demo,他有用, 我就想,好吧, 那刚好周末了,整理一套出来. 主要用到的是jquery uploadify 这个juqery的插件 ,可以无刷新 ...

  5. 使用Dropzone上传图片及回显演示样例

    一.图片上传所涉及到的问题 1.HTML页面中引入这么一段代码 <div class="row"> <div class="col-md-12" ...

  6. MVC ajaxSubmit上传图片

    注意事项: 1.提交form,必须引用jquery.form.min.js 2.不要使用mvc自带的Ajax.Form() 1.页面cshtml <form name="frmInpu ...

  7. jquery.uploadify+spring mvc实现上传图片

    一.前端页面 1.下载jquery.uploadify 去uploadify官网(http://www.uploadify.com/download/)下载压缩包,解压后放在如下路径: 2.html结 ...

  8. MVC实现上传图片的方法

    Form提交时,须注意form需要添加属性enctype="multipart/form-data",否则Request.Files.Count=0,无法上传图片. cshtml代 ...

  9. mvc中上传图片到指定文件夹中

    前台: @using (Html.BeginForm("AddImg", "UpFileImg", FormMethod.Post, new { enctype ...

随机推荐

  1. 解决启动httpd报: apr_sockaddr_info_get() failed for错误

    我测试库里 service httpd start 时报 下面错误 httpd: apr_sockaddr_info_get() failed for fengxin.wzjzt.centoshttp ...

  2. associatedtype关联类型

    associatedtype关联类型   定义一个协议时,有的时候声明一个或多个关联类型作为协议定义的一部分将会非常有用.关联类型为协议中的某个类型提供了一个占位名(或者说别名),其代表的实际类型在协 ...

  3. CorelDRAW X7中相机滤镜呈现出的复古照片效果

    CorelDRAW X7软件中相机效果滤镜较之以前版本又增添了许多功能,模拟各种“相机”镜头产生的效果,包括彩色.相片过滤器.棕褐色色调和时间器效果,可以让照片回到历史,展示过去流行的摄影风格.以下步 ...

  4. BZOJ 5508: [Tjoi2019]甲苯先生的字符串 矩阵乘法_思维

    求 $f[i][j]=∑f[i−1][k]$,$'a'<=k<='z'$ . 用矩阵乘法转移一波即可. 竟然独自想出来了QAQ Code: #include <bits/stdc++ ...

  5. SPOJ DISQUERY LCA + 倍增

    裸题,如此之水- Code: #include<cstdio> #include<algorithm> using namespace std; const int maxn ...

  6. 数据结构(5) 第五天 快速排序、归并排序、堆排序、高级数据结构介绍:平衡二叉树、红黑树、B/B+树

    01 上次课程回顾 希尔排序 又叫减少增量排序 increasement = increasement / 3 + 1 02 快速排序思想 思想: 分治法 + 挖坑填数 分治法: 大问题分解成各个小问 ...

  7. 网络教程(2)光纤和RF编码简介

    光纤: 想象一个symbol是light off 另一个是light on 另一种传输信息的方式using radio waves(无线电波: 这个router 内部以很高的频率变换电压 (例如2.4 ...

  8. 再见,OI(2019退役祭)

    有些话应该藏在心里,有些事情只属于自己. (想了一下,自己的OI生涯.自己所经历的事情还是留在自己的心里吧,一是自己文笔不好,二是每个人的世界观不同对事情的看法不同) 不要轻易地去评价一个人,每个人背 ...

  9. 训练1-R

    给出一个长度为N的数组,进行Q次查询,查询从第i个元素开始长度为l的子段所有元素之和. 例如,1 3 7 9 -1,查询第2个元素开始长度为3的子段和,1 {3 7 9} -1.3 + 7 + 9 = ...

  10. 【hihocoder 1303】模线性方程组

    [题目链接]:http://hihocoder.com/problemset/problem/1303 [题意] [题解] /* x % m[1] = r[1] x % m[2] = r[2] x = ...