asp.net实现文件无刷新上传方法汇总

遇到上传文件的问题,结合之前用到过的swfUpload,又找了一个无刷新上传文件的jquery插件uploadify,写篇博客记录一下分别介绍这两个的实现方法

swfUpload 导入swfUpload的开发包 添加js引用,引用swfUpload.js与handler.js文件,如果对swfUpload不了解、有疑问可以看看这篇文章页面初始化

修改handler.js文件中 上传成功的事件,serverData是服务器端的响应

Uploadify 导入uploadify开发包,从官网下载官网文档中文文档官网示例 添加js与css的引用,jquery.uploadify.js 、uploadify.css

(注:在css中引用uploadify-cancel.png图片文件的路径是可能不正确,可以在uploadify.css文件中自己进行更改)

页面初始化

页面初始化时,可以指定许多设置,并对上传成功的事件进行重载,data表示服务器端的响应

服务器端上传处理程序

//uploadify初始化
    $(function () {
      $('#file_upload').uploadify({
        //指定swf
        'swf': '/uploadify/uploadify.swf',
        //服务器端处理程序
        'uploader': '/Admin/UploadFileHandler.ashx',
        //按钮文本
        buttonText: '上传附件',
        //文件类型
        fileTypeExts: "*.zip;*.rar;*.doc;*.docx;*.xls;*xlsx",
        onUploadSuccess: OnFileUploadSuccess
      });
    });
    function OnFileUploadSuccess(file, data, response) {
      //服务器端响应
      if (data == 'noPermission') {
        alert('没有上传权限');
      }
      if (data == 'Error') {
        alert('上传失败');
      } else if (response) {
        alert('上传成功~~~');
        $("#filePath").val(data);
      }
    }

uploadify
/// <summary>
/// 上传文件
/// </summary>
public class UploadFileHandler : IHttpHandler, IRequiresSessionState
{
  public void ProcessRequest(HttpContext context)
  {
    context.Response.ContentType = "text/plain";
    //验证上传权限
    if (context.Session["User"] == null)
    {
      context.Response.Write("no permission");
      context.Response.End();
      return;
    }
    try
    {
      //获取上传文件
      //Filedata是客户端已经定义好的,如果想要更改,更改js文件中的配置
      HttpPostedFile image_upload = context.Request.Files["Filedata"];
      //获取文件扩展名
      string fileExt = System.IO.Path.GetExtension(image_upload.FileName).ToLower();
      //验证文件扩展名是否符合要求,是否是允许的图片格式
      if (!FileTypes.IsAllowed(fileExt))
      {
        return;
      }
      //当前时间字符串
      string timeString = DateTime.Now.ToString("yyyyMMddHHmmssfff");
      //保存虚拟路径构建
      string path = "/Upload/" + timeString + fileExt;
      //获取、构建要上传文件的物理路径
      string serverPath = context.Server.MapPath("~/" + path);
      //保存图片到服务器
      image_upload.SaveAs(serverPath);
      //输出保存路径
      context.Response.Write(path);
    }
    catch (Exception ex)
    {
      context.Response.Write("Error");
      //记录日志
      new Common.LogHelper(typeof(UploadFileHandler)).Error(ex);
    }
  }

  public bool IsReusable
  {
    get
    {
      return false;
    }
  }
}
public static class FileTypes
{
  private static List<string> allowedFileTypes = new List<string>();
  //获取允许json配置文件
  private static string jsonFilePath = Common.PathHelper.MapPath("~/AllowedFileTypes.json");

  /// <summary>
  /// 允许的文件类型
  /// </summary>
  public static List<string> AllowedFileTypes
  {
    get
    {
      return allowedFileTypes;
    }

    set
    {
      allowedFileTypes = value;
    }
  }

  /// <summary>
  /// 静态构造方法
  /// </summary>
  static FileTypes()
  {
    LoadFileTypesFromJson();
  }

  /// <summary>
  /// 从json文件中读取允许上传的文件类型
  /// </summary>
  private static void LoadFileTypesFromJson()
  {
    string types = File.ReadAllText(jsonFilePath);
    AllowedFileTypes = Common.ConverterHelper.JsonToObject<List<string>>(types);
  }

  /// <summary>
  /// 当添加允许文件类型时,更新到json文件
  /// </summary>
  public static void FileTypesToJson()
  {
    string types = Common.ConverterHelper.ObjectToJson(AllowedFileTypes);
    File.WriteAllText(jsonFilePath, types);
  }

  /// <summary>
  /// 新增允许上传文件扩展名
  /// </summary>
  /// <param name="newFileType"></param>
  public static void AddNewFileType(string newFileType)
  {
    AllowedFileTypes.Add(newFileType);
    FileTypesToJson();
  }

  /// <summary>
  /// 判断某种文件类型是否允许上传
  /// </summary>
  /// <param name="fileExt">文件扩展名</param>
  /// <returns>是否允许上传<code>true</code>允许上传</returns>
  public static bool IsAllowed(string fileExt)
  {
    foreach (string item in AllowedFileTypes)
    {
      if (fileExt.Equals(fileExt))
      {
        return true;
      }
    }
    return false;
  }
}

以上所述就是本文的全部内容了,希望大家能够喜欢。

时间: 2015-06-06

asp.net+js 实现无刷新上传解析csv文件的代码

前阵子工作中用到,贴上代码,仅保留上传有关的代码,发现code其实很少. 上传页面html/js 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xht

ASP强制刷新网页和判断文件地址实例代码

强制刷新网页 <% '强制性刷新随机验证码 '让随机验证码每次按IE的后退按钮时,返回登录页面的随即码都自动刷新, Response.expires=-1 Response.AddHeader"pragma","no-cache" Response.AddHeader"cache-control","no-store" %> 判断文件地址是否有效 <% Response.Write("")

asp.net下使用jquery 的ajax+WebService+json 实现无刷新取后台值的实现代码

首先贴上Jquery的ajax: 复制代码 代码如下: $.ajax({ url: 'ws_Ajax.asmx/BindDictByUpper', type: 'POST', contentType: 'application/json;charset=utf-8', dataType: 'json', data: '{ PpareId:"' + varlue + '"}', success: function (data) { var dataObj = eval("(&q

asp.net 简便无刷新文件上传系统

ps:flash实现的效果是好得多,但这不是我研究的范围,也没什么可比性. 兼容:ie6/7/8, firefox 3.5.5, opera 10.01, safari 4.0.3, chrome 3.0 效果预览 文件上传 选择文件 重命名 操作 状态 重置 选择文件 重置 选择文件 重置 选择文件 ps:由于需要后台,要测试系统请下载实例测试. ps2:在完整实例文件中,还有一个文件属性查看实例. 程序说明 [upload] 程序中最重要的方法就是upload了,调用它就可以进行无刷新上传.

asp.net刷新本页面的六种方法总结

第一: private void Button1_Click( object sender, System.EventArgs e )   {     Response.Redirect( Request.Url.ToString( ) ); } 第二: private void Button2_Click( object sender, System.EventArgs e )   {     Response.Write( "     <script language=javascri

asp.net中MVC借助Iframe实现无刷新上传文件实例

本文实例讲述了asp.net中MVC借助Iframe实现无刷新上传文件的方法.分享给大家供大家参考.具体实现方法如下: html: 复制代码 代码如下: <div id="uploadwindow" style="display: none;">     <form action="/ShopActivitys/ImportActivityItems" id="form1" name="form1&

刷新页面的几种方法小结(JS,ASP.NET)

Javascript刷新页面的几种方法: 1. history.go(0) 2. location.reload() 3. location=location 4. location.assign(location) 5. document.execCommand('Refresh') 6. window.navigate(location) 7. location.replace(location) 8. document.URL=location.href 自动刷新页面的方法: 1.页面自动

Asp.net 2.0 无刷新图片上传 显示缩略图 具体实现

兼容性想还不错:FF,CH,IE,猎豹,都是可以实现的.如果看到回显.当然就是成功了. 经历了好几天的不停的钻牛角尖,终于将这个二货弄出来了.真是煞费苦心啊.但是做出来的瞬间还是蛮开心的. 第一步:我们需要加载几个JS库.jquery库.jquery.form.js库. 下载这两个库,并引用到页面中. 以下为页面中 JS 代码: 复制代码 代码如下: function upload() {            var options = {                type: "POST

Asp.net利用JQuery AJAX实现无刷新评论思路与代码

首先在数据库中就建三个字段的表用来存储用户名和评论信息,Id只是为了设置唯一标示,所以设置成整型自增字段就行了. 再建一个HTML页面,只需简单的拉几个html控件出来摆着就行,注意在页面顶部有个<table>标签用来占位输出评论内容. Html页面代码就这样简单就行了: 复制代码 代码如下: <body><table id="room"> </table> <div> 用户名:<input id="Text1

asp.net使用AJAX实现无刷新分页

查询功能是开发中最重要的一个功能,大量数据的显示,我们用的最多的就是分页. 在ASP.NET 中有很多数据展现的控件,比如Repeater.GridView,用的最多的GridView,它同时也自带了分页的功能.但是我们知道用GridView来显示数据,如果没有禁用ViewState,页面的大小会是非常的大的.而且平时我们点击首页,下一页,上一页,尾页这些功能都是会引起页面回发的,也就是需要完全跟服务器进行交互,来回响应的时间,传输的数据量都是很大的. AJAX的分页可以很好的解决这些问题. 数

asp.net jquery无刷新分页插件(jquery.pagination.js)

采用Jquery无刷新分页插件jquery.pagination.js 实现无刷新分页效果 友情提示:本示例Handler中采用StringBuilder的append方法追加HTML,小数据量可以,但是大数据或是布局常变,建议返回JSON格式的数据,性能和灵活性更好! 1.插件参数列表  2.页面内容: 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Defaul

asp.net+jquery ajax无刷新登录的实现方法

因为工作需要研究了一下 js的ajax,下面是成果.主要是三部分:一.js部分 友情提示注意js部分中的 $("#btn_login")中的return false:这个可以阻止回转服务器不然还是会刷新 复制代码 代码如下: $(document).ready(function () {    $("#btn_login").click(function () {        postlogin();        return false;    });});

判断Email地址是否正确的几个函数(asp/php/javascript)

用js判断 复制代码 代码如下: function is_email( str ){ p = /^([\w\.-]+)@([a-zA-Z0-9-]+)(\.[a-zA-Z\.]+)$/; if(str.search(p) == -1){ return false; }else{ return true; } } 用PHP判断 复制代码 代码如下: function is_email($email){ $pattern="/^([\w\.-]+)@([a-zA-Z0-9-]+)(\.[a-zA-Z

Asp.Net 无刷新文件上传并显示进度条的实现方法及思路

相信通过Asp.Net的服务器控件上传文件在简单不过了,通过AjaxToolkit控件实现上传进度也不是什么难事,为什么还要自己辛辛苦苦来 实现呢?我并不否认"拿来主义",只是我个人更喜欢凡是求个所以然.本篇将阐述通过Html,IHttpHandler和 IHttpAsyncHandler实现文件上传和上传进度的原理,希望对你有多帮助. 效果图: 本文涉及到的知识点:1.前台用到Html,Ajax,JQuery,JQuery UI 2.后台用到一般处理程序(IHttpHandler)和

asp实现带刷新功能的验证码代码

将以下代码放到一个单独的页面checkcode.asp <% Option Explicit Response.buffer=true Call Com_CreatValidCode("validateCode") Sub Com_CreatValidCode(pSN) ' 禁止缓存 Response.Expires = -9999 Response.AddHeader "Pragma","no-cache" Response.AddHea

asp.net Ajax之无刷新评论介绍

首先还是建一个DoComments.aspx页面和一个DealComments.ashx页面(代码基本上都有注释,如果没写注释,请先看前几篇!).Docomments.aspx页面中的代码为: 复制代码 代码如下: <head runat="server"> <title></title> <script type="text/javascript"> var objXmlHttp = null; function C

asp.net防止刷新时重复提交(可禁用工具条刷新按钮)

前段时间遇到了需要禁用刷新的需求,f5按钮就不说了,简单的js就能把它禁用,但是工具条上的刷新按钮却傻傻干不掉. 如果简单的在刷新时重新加载画面,通过window.location.href="url"可以很容易的实现,但是需求是要求在刷新时什么都不做,保留画面的状态,这下子可就复杂化了. asp.net中分辨请求是重新请求还是通过刷新按钮再次请求不是很方便,为了实现这个效果,试过了很多的方式,一下面的两种为例 1. 复制代码 代码如下: private bool pageRefres

.net cs后台刷新aspx页面的四种方式

一:Response.Redirect(Request.Url.ToString()); 二:Response.Write("<script language=javascript>window.location.href=document.URL;</script>"); 三:Response.AddHeader("Refresh","0"); 四:Response.Write("<script lang

asp.net 判断数组是否存在某个值的方法

方法一: 复制代码 代码如下: string str1 = "0,1,2,3,4,5,6 "; string[] str = str1.Split( ', '); bool hasFlag=false; foreach (string a in str) { if (a == "7 ") { hasFlag=true; break; } } if(hasFlag) { //执行当前页 } else { //跳转 } 方法二 复制代码 代码如下: string []

Python实现变量数值交换及判断数组是否含有某个元素的方法

本文实例讲述了Python实现变量数值交换及判断数组是否含有某个元素的方法.分享给大家供大家参考,具体如下: 本来,这两个问题都属于的编程入门简单得不能再简单的问题,根本就不值得写篇记录来记录的. 一.变量数值交换 先说变量数值交换,从C语言开始,我们就知道要先设置一个临时变量,再把某元素的值覆盖此临时变量,避免临时覆盖等,如果不设置临时变量,还有位运算的交换形式 然而Python中根本就不用这么复杂,如果要交换变量e1,e2彼此的值,就下面一行代码就足矣: e1,e2=e2,e1; 比如,如下

JavaScript判断数组是否包含指定元素的方法

本文实例讲述了JavaScript判断数组是否包含指定元素的方法.分享给大家供大家参考.具体如下: 这段代码通过prototype定义了数组方法,这样就可以在任意数组调用contains方法 /** * Array.prototype.[method name] allows you to define/overwrite an objects method * needle is the item you are searching for * this is a special variab

python实现判断数组是否包含指定元素的方法

本文实例讲述了python实现判断数组是否包含指定元素的方法.分享给大家供大家参考.具体如下: python判断数组是否包含指定的元素的方法,直接使用in即可,python真是简单易懂 print 3 in [1, 2, 3] # membership (1 means true inventory = ["sword", "armor", "shield", "healing potion"] if "healin

JavaScript判断数组重复内容的两种方法(推荐)

前言 一般,我们可能会给数组去重,这个操作并不复杂,执行一个循环就是了.现在,我要做的是,判断数组中是否有重复的内容,如果有,返回 true 否则,返回 false. 思路 把数组变成字符串 循环原数组,拿每一个字段和这个字符串进行比对,看是否有重复 如何拿A字符串和B字符串进行对比,并且要求判断出B字符串中包含过个A字符串呢? 方法一 indexOf() 和 lastIndexOf() 对比法. 首先,我们构建代码: var arr = ["aa","bb",&q

PHP查找一列有序数组是否包含某值的方法

问题:对于一列有序数组,如何判断给出的一个值,该值是否存在于数组. 思路:判断是否存在,最简单是,直接循环该数组,对每一个值进行比较.但是对于有序数组来说,这样写就完全没有利用好"有序"这一特点. 所有我们使用到"二分法查找", //有序数组为 $arr = array(2,5,66,87,954,1452,5865); //查找值 $str = 1452; //我们先定义 三个参数 $front = 0;//一个开始值下标 $end = count($arr) -

ASP中获得Select Count语句返回值的方法

我们一般统计数据库记录时会用到Select Count(*)语句,当我们使用SQL Server的查询分析器时,直接输入Select Count(*) From 表名即会统计出该表中有几条记录,可是我们用ASP来实现时该怎么返回值呢?即如何输出统计出来的记录总数呢?请接着往下看. 其实我们只要给SQL语句的查询结果取个别名即可解决问题,然后用ASP语句输出这个别名即可,相关代码如下: 复制代码 代码如下: Set rs=conn.Execute("Select Count(*) As 'Tota

ASP.NET文本框密码赋默认值的方法

对于普通的文本输入框,可以使用下边的方法赋默认值: <asp:TextBox ID="TextBox1" runat="server">12345</asp:TextBox> 将输入框类型改为密码后,页面上密码框总是空白,默认值丢失: <asp:TextBox ID="TextBox1" runat="server" TextMode="Password">12345&l

javascript如何判断数组内元素是否重复的方法集锦

var str = new Array();   比如有这么一组数组,里面放了20个18位的身份证号码   要判断里面的身份证号码是否有重复   如何快速判断? 复制代码 代码如下: var ary = new Array("111","22","33","111");     var s = ary.join(",")+",";     for(var i=0;i<ary.len

ASP.NET中用js取CheckBoxList中值的方法实例

做的一些项目都比较小,而且时间紧,有好多东西都没来得急总结,趁这会还有点时间把前面项目中的用到的知识点分享下,只为以后方便使用.前台页面代码 复制代码 代码如下: <!--关键字-->    <div id="keyWordsDiv" style="border: 2px solid #6FA1D9; display: none; position: absolute;        top: 0px; left: 0px; width: 260px; he