在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. 【Oracle】创建用户

    任务: 1)创建用户siebel,密码oracle 2)授予sse_role,tblo_role角色 3)siebel用户没有对system,sysaux的使用权限 4)默认表空间ts_users,无 ...

  2. Windows 10 常用软件推荐

    QQ/TIM 大众的通讯工具,十多年之后的今天,依然是国内常驻用户第一的通讯工具 截图.远程桌面.视频会议.文件传送依旧是非常好用 TIM 算是轻聊版的升级版 微信 for Windows 近年新兴的 ...

  3. python的小数据池和深浅拷贝

    小数据池 一种数据缓存机制,也称驻留机制 在同一代码块,相同的值不会开辟新的内存 特殊字符除外 小数据池只针对:在控制台时! 数字 :-5到256间的整数会被缓存 布尔值:都会缓存8 字符串 小于等于 ...

  4. JsonPluginsUtil

    package utils; import java.lang.reflect.Field;import java.text.SimpleDateFormat;import java.util.Arr ...

  5. 快速搭建一个本地的FTP服务器 win10及win7

    快速搭建一个本地的FTP服务器   如果需要开发FTP文件上传下载功能,那么需要在本机上搭建一个本地FTP服务器,方便调试. (win10) 第一步:配置IIS Web服务器 1.1 控制面板中找到“ ...

  6. Java将数据以Excel文件形式导出后台代码实现

    下面代码实现所需jar包: tomcat-embed-core-8.5.11.jar: commons-lang3-3.0.1.jar: commons-io-2.5.jar: poi-3.9.jar ...

  7. IOS - 零碎

    ---恢复内容开始--- 1.模拟器目录: ProjectNameApk.documents.library(cache.preference.cookies).temp 2.Edit-Refacto ...

  8. 洛谷—— P1220 关路灯

    https://www.luogu.org/problem/show?pid=1220 题目描述 某一村庄在一条路线上安装了n盏路灯,每盏灯的功率有大有小(即同一段时间内消耗的电量有多有少).老张就住 ...

  9. iOS中的crash防护（二）KVC造成的crash

      接上篇< iOS中的crash防护(一)unrecognized selector sent to instance> 我们攻克了找不到方法实现的crash,这一篇我这里主要分析一下在 ...

  10. [React Router] Prevent Navigation with the React Router Prompt Component

    In this lesson we'll show how to setup the Prompt component from React Router. We'll prompt with a s ...