让UpdatePanel支持文件上传(1):开始 .
UpdatePanel从一开始就无法支持AJAX的文件上传方式。Eilon Lipton写了一篇文章解释了这个问题的原因。文章中提供了两个绕开此问题的方法:
- 将“上传”按钮设为一个传统的PostBack控件而不是异步PostBack。您可以使用多种方法来这么做:例如将一个按钮放置在UpdatePanel外,将按钮设为某个UpdatePanel的PostBackTrigger,或者调用ScriptManager.RegisterPostBackControl来注册它。
- 建立一个不使用ASP.NET AJAX的上传页面,很多站点已经这么做了。
不过,我们为什么不使UpdatePanel兼容FileUpload控件(<input type="file" />)呢?如果可以这样,一定能够受需要使用UpdatePanel上传文件的用户欢迎。
我们首先要解决的问题是,找到一种能够将信息发送到服务器端的方法。我们都知道XMLHttpRequest只能发送字符串。在这里,我们使用和其他的异步上传文件的解决方案一样,使用iframe来上传文件。iframe元素是一个非常有用的东西,即使在AJAX这个概念出现之前,它已经被用于制作一些异步更新的效果了。
其次,我们应该如何改变当前传输数据的行为呢?幸亏Microsoft AJAX Library有着强大的异步通讯层,我们可以方便创建一个UpdatePanelIFrameExetender来继承Sys.Net.WebRequestExecutor,并且将它交给一个上传文件的WebRequest对象。因此,下面的代码可以作为我们开发组件的第一步:
第一步
Type.registerNamespace("Jeffz.Web");
// the new executor will use the element witch initiated the async postback.
Jeffz.Web.UpdatePanelIFrameExecutor = function(sourceElement)
{
// ...
}
Jeffz.Web.UpdatePanelIFrameExecutor.prototype =
{
// ...
}
Jeffz.Web.UpdatePanelIFrameExecutor.registerClass(
"Jeffz.Web.UpdatePanelExecutor", Sys.Net.WebRequestExecutor);
Jeffz.Web.UpdatePanelIFrameExecutor._beginRequestHandler = function(sender, e)
{
var inputList = document.getElementsByTagName("input");
for (var i = 0; i < inputList.length; i++)
{
var type = inputList[i].type;
if (type && type.toUpperCase() == "FILE")
{
e.get_request().set_executor(
new Jeffz.Web.UpdatePanelExecutor(e.get_postBackElement()));
return;
}
}
}
Sys.Application.add_init(function()
{
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(
Jeffz.Web.UpdatePanelIFrameExecutor._beginRequestHandler);
});
在上面的代码段中,我们在页面初始化时监听了PageRequestManager对象的beginRequest事件。当PageRequestManager触发了一个异步请求时,我们会检查页面上是否有<input type="file" />控件。如果存在的话,则创建一个新的UpdatePanelIFrameExecutor实例,并分配给即将执行的WebRequest对象。
根据异步通讯层的实现,WebRequest的作用只是一个保存请求信息的容器,至于如何向服务器端发送信息则完全是Executor的事情了。事实上Executor完全可以不理会WebRequest携带的信息自行处理,而我们的UpdatePanelIFrameExecutor就是这样的玩意儿。它会改变页面上的内容,将信息Post到IFrame元素中,并且处理从服务器端获得的数据。(未完待续)
让UpdatePanel支持文件上传(1):开始 .的更多相关文章
- 让UpdatePanel支持文件上传(2):服务器端组件 .
我们现在来关注服务器端的组件.目前的主要问题是,我们如何让页面(事实上是ScriptManager控件)认为它接收到的是一个异步的回送?ScriptManager控件会在HTTP请求的Header中查 ...
- RPC基于http协议通过netty支持文件上传下载
本人在中间件研发组(主要开发RPC),近期遇到一个需求:RPC基于http协议通过netty支持文件上传下载 经过一系列的资料查找学习,终于实现了该功能 通过netty实现文件上传下载,主要在编解码时 ...
- Openresty + nginx-upload-module支持文件上传
0. 说明 这种方式其实复杂,麻烦!建议通过这个方式搭建Openresty文件上传和下载服务器:http://www.cnblogs.com/lujiango/p/9056680.html 1. 包下 ...
- java nio 写一个完整的http服务器 支持文件上传 chunk传输 gzip 压缩 使用过程 和servlet差不多
java nio 写一个完整的http服务器 支持文件上传 chunk传输 gzip 压缩 也仿照着 netty处理了NIO的空轮询BUG 本项目并不复杂 代码不多 ...
- springmvc学习笔记--支持文件上传和阿里云OSS API简介
前言: Web开发中图片上传的功能很常见, 本篇博客来讲述下springmvc如何实现图片上传的功能. 主要讲述依赖包引入, 配置项, 本地存储和云存储方案(阿里云的OSS服务). 铺垫: 文件上传是 ...
- 让nginx支持文件上传的几种模式
文件上传的几种不同语言和不同方法的总结. 第一种模式 : PHP 语言来处理 这个模式比较简单, 用的人也是最多的, 类似的还有用 .net 来实现, jsp来实现, 都是处理表单.只有语言的差别, ...
- 配置servlet支持文件上传
Servlet3.0为Servlet添加了multipart配置选项,并为HttpServletRequest添加了getPart和getParts方法获取上传文件.为了使Servlet支付文件上传需 ...
- 测试平台系列(92) 让http请求支持文件上传
大家好~我是米洛! 我正在从0到1打造一个开源的接口测试平台, 也在编写一套与之对应的教程,希望大家多多支持. 欢迎关注我的公众号米洛的测开日记,获取最新文章教程! 回顾 上一节呢,我们编写了oss的 ...
- 让SAE下的wordpress支持文件上传
非PHP程序员照着源码打的小布丁… SAE是不允许本地磁盘读写的,所以使用wordpress撰写文章的时候, 上传控件默认是用不了的,幸好SAE提供了storage服务来存储文件,那就可以修改word ...
随机推荐
- Scala IDEA for Eclipse里用maven来创建scala和java项目代码环境(图文详解)
这篇博客 是在Scala IDEA for Eclipse里手动创建scala代码编写环境. Scala IDE for Eclipse的下载.安装和WordCount的初步使用(本地模式和集群模式) ...
- (转载)GRASP职责分配原则
GRASP (职责分配原则) 要学习设计模式,有些基础知识是我们必须要先知道的,设计模式是关于类和对象的一种高效.灵活的使用方式,也就是说,必须先有类和对象,才能有设计模式的用武之地,否则一切都是空谈 ...
- mysql8安装配置备忘
Mysql8安装配置 1. 初始化 进入mysql安装目录中的bin目录,在cmd中输入: mysqld --initialize --console 加上--console参数可以看到初始化之后的默 ...
- Svg和canvas的区别,伪类选择器有哪些(归类)
区别一:svg绘制出来的每一个图形的元素都是独立的DOM节点,能够方便的绑定事件或用来修改.canvas输出的是一整幅画布: 区别二:svg输出的图形是矢量图形,后期可以修改参数来自由放大缩小,不会是 ...
- windows 10安装gensim、nltk
一.安装gensim 1.什么事gensim gensim是一个python的科学库,gensim包含了TF-IDF.随机投影.word2vec和document2vec算法的实现,分层Dirchle ...
- 从零开始学JAVA(07)-使用SpringMVC4写helloworld
一.关于开发环境 Eclipse IDE for Java EE Developers Jdk 1.7 (32位版本) SpringMVC 4.1.5.RELEASE apache-tomcat-7. ...
- [C#]跨模块的可选参数与常量注意事项
假设某个DLL里有这么一个类: // Lib.dll public class Lib { public const string VERSION = "1.0"; public ...
- Bootstrap 3.0的扁平化来了
Bootstrap 3 RC1 发布了,从官方上看,Bootstrap 3 似乎也开始趋于扁平化的风格设计. 网站UI和Button bootstrap 2.3.2以下的整体UI和图标是以box-sh ...
- 关于react-router-dom的一些记录
最近在做的新项目使用的技术栈是 React+AntDesign,本篇主要记录在实践过程中使用react-router-dom时遇到的一些方法的总结. 1.HashRouter和BrowserRoute ...
- 解决:Thinkphp3 返回中文内容出现乱码