asp.net多文件上传

用的falsh插件swfupload

1、html页面中添加引用:

1 <script src="/Scripts/uploadFile/callbacks.js" type="text/javascript"></script>
2 <script src="/Scripts/uploadFile/fileprogress.js" type="text/javascript"></script>
3 <script src="/Scripts/uploadFile/swfupload.js" type="text/javascript"></script>
4 <script src="/Scripts/uploadFile/swfupload.queue.js" type="text/javascript"></script>

2、添加JS配置

需要更改的参数:upload_url(后台接收文件的地址)、flash_url(flash文件在服务器中的地址)、flash9_url、button_image_url(选择文件按钮的背景图片)

 1  <script type="text/javascript">
 2         $(function () {
 3             var swfupload = null;
 4             var settings = {
 5                 upload_url: ‘/ashx/uploadFile/AddFile.ashx‘,           //附件上传服务器地址
 6                 file_post_name: ‘file‘,      //向后台提交的表单名
 7                 flash_url: "/Scripts/uploadFile/swfupload.swf",
 8                 flash9_url: "/Scripts/uploadFile/swfupload_fp9.swf",
 9                 post_params: { "PHPSESSID": "<?php echo session_id(); ?>" }, //解决session丢失问题
10                 file_size_limit: "50 MB",                                 //文件大小限制,此处仅是前端flash选择时候的限制,具体还需要和后端结合判断
11                 file_types: "*.xls;*.xlsx", //允许的扩展名,多个扩展名之间用分号隔开,支持*通配符
12                 file_types_description: "Excel",                      //扩展名描述
13                 file_upload_limit: 0,                                   //单次可同时上传的文件数目
14                 file_queue_limit: 0,                                      //队列中可同时上传的文件数目
15                 custom_settings: {                                         //自定义设置,用户可在此向服务器传递自定义变量
16                     startUploadId: "btn_addFile"
17                 },
18                 debug: false,
19
20                 // 按钮设置
21                 button_image_url: "/Images/btn_swfupload.png",
22                 button_width: "150",
23                 button_height: "30",
24                 button_placeholder_id: "spanButtonPlaceHolder",
25                 button_text: ‘<span class="theFont" style="border:1px #ccc solid">请选择文件...</span>‘,
26                 button_text_style: ".theFont { font-size:15px;background-color:white;}",
27                 button_text_left_padding: 2,
28                 button_text_top_padding: 5,
29
30                 // 所有回调函数 in handlers.js
31                 swfupload_preload_handler: preLoad,
32                 swfupload_load_failed_handler: loadFailed,
33                 file_queued_handler: fileQueued,
34                 file_queue_error_handler: fileQueueError,
35                 file_dialog_start_handler: function () {
36                     this.cancelUpload();
37                 },
38                 //选择文件完成回调
39                 file_dialog_complete_handler: function (numFilesSelected, numFilesQueued) {
40                     var me = this;        //此处的this是swfupload对象
41                     if (numFilesQueued > 0) {
42                         var start = document.getElementById(this.customSettings.startUploadId);
43                         //start.style.display = "";
44                         start.onclick = function () {
45                             me.startUpload();
46                         }
47                     }
48                 },
49                 upload_start_handler: function () {
50                     var ddlSeller = $(‘#ddlSeller‘).val();
51                     this.setPostParams({
52                         ‘type‘: ddlSeller
53                     });
54                 },
55                 upload_progress_handler: uploadProgress,
56                 upload_error_handler: uploadError,
57                 upload_success_handler: function (file, serverData) {
58                      //上传成功后的回调方法73                 },
74                 //上传完成回调
75                 upload_complete_handler: uploadComplete,
76                 //队列完成回调
77                 queue_complete_handler: function (numFilesUploaded) {
78                 }
79             }
80             swfupload = new SWFUpload(settings);
81         });
88
89
90     </script>

3、html中必须的元素有:

<span id="spanButtonPlaceHolder"></span>        这个是显示‘选择文件’按钮

<label id="label_file_Name" ></label>       这个是选择文件后,用来显示  选择的文件名

<input type="button" class="btn btn-primary btn-large" style="" value="导入" id="btn_test"/>   这个是用来做一些校验性判断
<input type="button" class="btn btn-primary btn-large" style="display:none;" value="导入" id="btn_addFile"/>  这个是真正触发上传文件的按钮,会向服务器post

4、需要用到的事件方法
   1)选择文件后的方法:file_dialog_complete_handler   不用修改;

2)上传文件成功后的方法: upload_success_handler  根据自己的业务需要,进行更改

5、其他的一些JS校验性判断

 1 $(function () {
 2         $(‘#btn_test‘).click(function () {
 3             var label_file_Name = $(‘#label_file_Name‘).html();
 4             if (label_file_Name.length < 1) {
 5                 alert(‘请选择文件!‘);
 6                 return false;
 7             }
 8             if (confirm("确认上传?")) {
 9                 $(‘#btn_addFile‘).click();
10                 $(‘#btn_test‘).hide();
11             }
12
13         });
14
15
16
17     });

插件下载地址:http://pan.baidu.com/s/1gdhgUyf

时间: 2024-10-11 10:46:07

asp.net多文件上传的相关文章

ASP.NET MVC 文件上传和路径处理

ASP.NET MVC 文件上传和路径处理总结 目录 文件的上传和路径处理必须解决下面列出的实际问题: 1.重复文件处理 2.单独文件上传 3.编辑器中文件上传 4.处理文章中的图片路径 5.处理上传地址的变化 一.上传文件和重复文件处理 文件处理的原则是:不在数据库中保存文件,只在数据库中保存文件信息(Hash值等).采取文件的MD5重命名文件在一般情况足够处理文件的重复问题,强迫症倾向则可以考虑将MD5和其他摘要算法结合. public static string Save(HttpPost

ASP.NET MVC文件上传【转】

最近用到了文件上传功能,下面给出ASP.NET MVC文件上传的一个简单示例: 一.前端代码 @using (Html.BeginForm("UploadFile", "Home", FormMethod.Post, new {enctype = "multipart/form-data"})) { <div>文件上传:<input type="file" name="myFile"/&g

ASP.NET使用文件上传控件上传图片

ASPX代码 <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xht

ASP.NET - 多文件上传,纯代码,不使用插件

解决方案: 前段代码: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MultiFileUpload.aspx.cs" Inherits="WebApplication1.MultiFileUpload1" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/x

基于asp.net 的文件上传和下载~~~转

基于asp.net 的文件上传和下载 摘要: 文件的上传和下载是网络中非常重要的两种应用, 本文介绍了使用asp.net 控件实现文件上传的基本方法.解决了当上传大文件时出现各种问题, 并给出了几种解决方案和技巧.另外, 下载文件用二进制读写的方式实现. 1 引言          文件的上传和下载是网络中非常重要的两种应用.其实现方法主要有FTP 方式和HTTP 方式两种, FTP( File Transfer Protocol)是指文件传输协议, 主要用来在网络上传输文件.这种方式虽说文件传

ASP.NET 大文件上传的简单处理

在 ASP.NET 开发的过程中,文件上传往往使用自带的 FileUpload 控件,可是用过的人都知道,这个控件的局限性十分大,最大的问题就在于上传大文件时让开发者尤为的头疼,而且,上传时无法方便的做到多线程的操控和上传进度的显示.在此给大家推荐一款简单易用的上传组件,从而快速便捷得解决了 ASP.NET 中的大文件上传问题. 首先,我们需要这个名为 RanUpLoad 的组件(下面例子中附带),这两个 dll 文件添加到项目的引用中区,xml 文件也要复制在项目中的 bin 文件夹下,也就是

asp.net core文件上传与下载

public class FileController : Controller { /// <summary> /// 跟asp.net webform和asp.net mvc不一样,通过注入的方式,获取项目所在路径 /// </summary> private IHostingEnvironment _hostEnv; public FileController(IHostingEnvironment env) { _hostEnv = env; //其他服务 } public

C# asp.net实现文件上传

前端代码: 使用visual studio开发实现文件上传 前端页面代码: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="scientist.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio

基于jquery.uploadify的asp.net大文件上传

以前项目的上传都是十几兆的文件,虽然没有进度条,但客户端响应比较快,客户还能接受.在新项目中,客户提供的Excel,要求导入到系统中,但Excel偶尔会将近百兆,客户对上传的使用体验提出了要求.后来在园子里找了朋友写的博客,加上自己的整理,最终实现了基于asp.net的带进度条的百兆文件上传. 在这里首先感谢两位园友,在这里附上参考的两位园友的博客. 马维拉的真实之眼:http://www.cnblogs.com/telephoner/p/3185081.html oec2003:http://

ASP.NET Core 文件上传

小分享:我有几张阿里云优惠券,用券购买或者升级阿里云相应产品最多可以优惠五折!领券地址:https://promotion.aliyun.com/ntms/act/ambassador/sharetouser.html?userCode=ohmepe03 前言 上篇博文介绍了怎么样在 asp.net core 使用 Redis 和 Protobuf 进行 Session缓存.本篇的是开发过程中使用的一个小功能,怎么做单文件和多文件上传. 如果你觉得对你有帮助的话,不妨点个[推荐]. 目录 单文件