基于mvc三层架构和ajax技术实现最简单的文件上传

时间：2022-03-16 06:24:57

前台页面提交文件

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>文件操作</title>
</head>
<body>
<form id="upFileForm">
<div style="margin:30px;">
<span style="margin-right:10px;">上传文件</span><input type="file" name="UpFile" id="UpFile" style="width:12%;" />
<input type="button" onclick="upFile()" value="确认上传" />
</div>
</form>

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.form.js"></script>

<script>

//上传文件
function upFile() {
var file = document.getElementById("UpFile").files[0];
if (!file) {
alert("请选择文件!");
return;
}
var size = file.size / 1024 / 1024;
if (size > 50) {
alert("图片文件不能大于50M");
return;
}
$("#upFileForm").ajaxSubmit({
url: "/File/UploadFile",
type: "post",
dataType: "json",
success: function (data) {
if (data == "" || data == "0") {
alert("上传失败");
}
if (data == "2") {
alert("不支持上传该文件");
} else {
alert(JSON.stringify(data));
}
},
error: function (aa) {
alert(aa);
}
});
}
</script>

</body>
</html>

后台接收和上传

[HttpPost]
public JsonResult UploadFile()
{
HttpRequest request = System.Web.HttpContext.Current.Request;
HttpFileCollection FileCollect = request.Files;
string path = "";//文件的完整路径
//文件保存目录路径
string imgPathName = DateTime.Now.ToString("yyyyMMdd");//以日期为文件存放的上层文件夹名
string savePath = "/upload/file/" + imgPathName + "/";//文件存放的完整路径
//如果文件路径不存在则创建文件夹
if (!Directory.Exists(Server.MapPath(savePath)))
{
Directory.CreateDirectory(Server.MapPath(savePath));
}
//定义允许上传的文件扩展名
Hashtable extTable = new Hashtable();
extTable.Add("file", "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");

if (FileCollect.Count > 0)//如果集合的数量大于0,多文件上传情况
{
foreach (string str in FileCollect)
{
HttpPostedFile imgFile = FileCollect[str];//用key获取单个文件对象HttpPostedFile
string fileName = imgFile.FileName;//获取文件名
string fileExt = Path.GetExtension(fileName).ToLower();//获取文件后缀名
//判断文件类型是否正确
if (Array.IndexOf(((string)extTable["file"]).Split(','), fileExt.Substring(1).ToLower()) == -1)
{
//文件类型不正确
return Json("2");
}
string imgName = DateTime.Now.ToString("yyyyMMddhhmmss");//文件别名
string imgPath = savePath + imgName + "-" + imgFile.FileName;//构造文件保存路径
string AbsolutePath = Server.MapPath(imgPath);
imgFile.SaveAs(AbsolutePath);//将上传的东西保存
path = imgPath;//获得文件完整路径并返回到前台页面
}
return Json(path);
}
else
{
//上传失败
return Json("0");
}
}

基于mvc三层架构和ajax技术实现最简单的文件上传的更多相关文章

  1. 服务器文档下载zip格式 SQL Server SQL分页查询 C&num;过滤html标签 EF 延时加载与死锁 在JS方法中返回多个值的三种方法（转载） IEnumerable&comma;ICollection&comma;IList接口问题 不吹不擂，你想要的Python面试都在这里了【315&plus;道题】 基于mvc三层架构和ajax技术实现最简单的文件上传 事件管理

    服务器文档下载zip格式   刚好这次项目中遇到了这个东西,就来弄一下,挺简单的,但是前台调用的时候弄错了,浪费了大半天的时间,本人也是菜鸟一枚.开始吧.(MVC的) @using Rattan.Co ...

  2. Ajax技术——带进度条的文件上传

    1.概述 在实际的Web应该开发或网站开发过程中,经常需要实现文件上传的功能.在文件上传过程中,经常需要用户进行长时间的等待,为了让用户及时了解上传进度,可以在上传文件的同时,显示文件的上传进度条.运 ...

  3. 基于Metronic的Bootstrap开发框架经验总结（5）--Bootstrap文件上传插件File Input的使用

    Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使用的时候,也是一步一个脚印一样摸着石头过河,这个控件在界面呈现上,叫我之前使用过的Uploadi ...

  4. Ajax实现带进度条的文件上传

    Ajax实现带进度条的文件上传 文件上传页面运行效果 上传文件并显示进度条运行效果 代码如下; DiskFileItemFactory factory = new DiskFileItemFactor ...

  5. （转）基于Metronic的Bootstrap开发框架经验总结（5）--Bootstrap文件上传插件File Input的使用

    http://www.cnblogs.com/wuhuacong/p/4774396.html Bootstrap文件上传插件File Input是一个不错的文件上传控件,但是搜索使用到的案例不多,使 ...

  6. &lbrack;SAP ABAP开发技术总结&rsqb;文本文件、Excel文件上传下传

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  7. spring mvc 简单的文件上传与下载

    上传文件有很多种方法,这里主要讲解的是spring mvc内提供的文件上传 前提使用:spring mvc 在这个之前我们需要把环境给配置好 1:springmvc的XML配置文件加上这一段就即可, ...

  8. WebApi实现Ajax模拟Multipart&sol;form-data方式多文件上传

    前端页面代码: <input type="file" class="file_control" /><br /> <input t ...

  9. spring mvc源码-》MultipartReques类-》主要是对文件上传进行的处理，在上传文件时，编码格式为enctype&equals;&quot&semi;multipart&sol;form-data&quot&semi;格式，以二进制形式提交数据，提交方式为post方式。

    spring mvc源码->MultipartReques类-> MultipartReques类主要是对文件上传进行的处理,在上传文件时,编码格式为enctype="multi ...

随机推荐

  1. python---set集合

    集合(set)是一个无序不重复元素的序列. #!/usr/bin/python3 student = ({'Tom', 'Jim', 'Mary', 'Tom', 'Jack', 'Rose'}) p ...

  2. SQL2008游标

    最近让写一个自动生成数据的存储过程,其中会遍历表中数据并做出相应处理,因为数据量不算太大所以使用到了游标,初识游标遇到几个小问题,所以来和大家一起分享一下: 使用游标的五个步骤: 1.声明游标 语法: ...

  3. Android打开WIFI或者移动网络的代码实现

    MainActivity如下: package wy.testnetwork; import java.lang.reflect.Field; import java.lang.reflect.Inv ...

  4. Qt出现堆溢出&lpar;Error Code -1073741823&rpar;

    症状 在使用Debug模式时,程序可以正常启动,但是切换到Release模式,程序报错,错误码-1073741823 原因 程序中使用了过多的new.比如: QActionGroup *mProtoc ...

  5. vue 学习中 版本、问题集锦

    看学习视频,因为年份比较早了,其实vue早已迭代到vue2.0了,遇到一些问题: v-for遍历数组,获取索引 注意:在2.0版是1~10中,$index已废除,索引 (item,index). 如下 ...

  6. python　学习笔记

    1. 关于两者详细解释,参考链接:www.crifan.com/python_re_search_vs_re_findall/ 代码图

  7. &lbrack;swarthmore cs75&rsqb; Compiler 3 – Cobra

    课程回顾 Swarthmore学院16年开的编译系统课,总共10次大作业.本随笔记录了相关的课堂笔记以及第5次大作业. 增加了bool数据表示和比较运算符的支持,具体语法参考下图: 第一种int和bo ...

  8. 201803020001-多重MACD图&period;png

  9. Android Volley 库的使用

    本文内容 什么是 Volley 库 Volley 能做什么 Volley 架构 环境 演示 Volley 库的使用 参考资料 Android 关于网络操作一般都会介绍 HttpClient 以及 Ht ...

  10. springBoot Feign Hystrix

    1.引入依赖包 <!-- 引入关于 hystrix的依赖 --> <dependency> <groupId>org.springframework.cloud&l ...

相关文章