【该上传组件已经停止更新,该上传组件已经在项目中使用。在使用过程中如果发现bug请大家回复此贴。2011-02-27】

主要是为了用swfUpload实现上传,为了新鲜好玩。

理解swfUpload可以上网查找,以下是在网上找到,个人觉得解释比较全面的文章:

http://blog.endlesscode.com/2010/03/26/swfupload%E6%B5%85%E6%9E%90/

请下载最新版的,最近修改了几个问题

经过研究,结合Extjs3.3做了以下组件:


 

本上传组件最新修改为v1.1,加入了状态和行删除。


 

最新版本为v1.2,修改了上传状态和进度不同步的bug

后台返回说明:

  1. .add{
  2. background-image: url(images/add.gif) !important;
  3. }
  4. .up{
  5. background-image: url(images/up.gif) !important;
  6. }
  7. .delete{
  8. background-image: url(images/delete.gif) !important;
  9. }
  10. .delete2{
  11. background-image: url(images/delete2.gif) !important;
  12. }
  1. Ext.onReady(function(){
  2. Ext.QuickTips.init();
  3. new Ext.Window({
  4. width : 650,
  5. title : 'swfUpload demo',
  6. height : 300,
  7. layout : 'fit',
  8. items : [
  9. {
  10. xtype:'uploadPanel',
  11. border : false,
  12. fileSize : 1024*50,//限制文件大小
  13. uploadUrl : 'uploadFiles.action',
  14. flashUrl : 'swfupload.swf',
  15. filePostName : 'file', //后台接收参数
  16. fileTypes : '*.*',//可上传文件类型
  17. postParams : {savePath:'upload\\'} //上传文件存放目录
  18. }
  19. ]
  20. }).show();
  21. });

最新代码请下载附件!uploader_v1.2.rar

当然还有没有完善的地方,请大家自由发挥吧!

同时发表于Extjs官方网:http://www.sencha.com/forum/showthread.php?118058-UploadPanel(Extjs3.0-swfUpload)

转载请注明出处:http://czpae86.iteye.com/

Extjs3.3 + swfUpload2.2 实现多文件上传组件的更多相关文章

  1. Atitit..文件上传组件选型and最佳实践总结(3)----断点续传控件的实现

    Atitit..文件上传组件选型and最佳实践总结(3)----断点续传控件的实现 1. 实现思路:::元插件,元设置... 1 2. 实现流程downzip,unzip,exec 1 3. Zip  ...

  2. Atitit..文件上传组件选型and最佳实践总结(2)----断点续传

    Atitit..文件上传组件选型and最佳实践总结(2)----断点续传 1. 断点续传的原理 1 2. 如何判断一个插件/控件是否支持断点续传?? 1 3. 常用的组件选型结果::马 1 4. 自定 ...

  3. 异步文件上传组件 Uploader

    Uploader是非常强大的异步文件上传组件,支持ajax.iframe.flash三套方案,实现浏览器的全兼容,调用非常简单,内置多套主题支持 和常用插件,比如验证.图片预览.进度条等,广泛应用于淘 ...

  4. 多文件上传组件FineUploader使用心得

    原文 多文件上传组件FineUploader使用心得 做Web开发的童鞋都知道,需要经常从客户端上传文件到服务端,当然,你可以使用<input type="file"/> ...

  5. ASP中文件上传组件ASPUpload介绍和使用方法

    [导读]要实现该功能,就要利用一些特制的文件上传组件.文件上传组件网页非常多,这里介绍国际上非常有名的ASPUpload组件 1 下载和安装ASPUpload  要实现该功能,就要利用一些特制的文件上 ...

  6. Atitit..文件上传组件选择and最佳实践的总结(2)----HTTP

    Atitit..文件上传组件选型and最佳实践总结(2)----断点续传 1. 断点续传的原理 1 2. 怎样推断一个插件/控件是否支持断点续传?? 1 3. 经常使用的组件选型结果::马 1 4.  ...

  7. 文件上传组件FileUpload 以及邮箱搭建JavaMail

     文件上传与下载 1.1 文件上传 案例: 注册表单/保存商品等相关模块! --à 注册选择头像 / 商品图片 (数据库:存储图片路径 / 图片保存到服务器中指定的目录) 文件上传,要点: 前台: 1 ...

  8. Baidu WebUploader 前端文件上传组件的使用

    简介 WebUploader是由Baidu WebFE(FEX)团队开发的一个简单的以HTML5为主,FLASH为辅的现代文件上传组件.在现代的浏览器里面能充分发挥HTML5的优势,同时又不摒弃主流I ...

  9. BootStrap fileinput.js文件上传组件实例代码

    1.首先我们下载好fileinput插件引入插件 ? 1 2 3 <span style="font-size:14px;"><link type="t ...

随机推荐

  1. unity StreamingAssets路径

    原地址:http://blog.csdn.net/nateyang/article/details/8493791 我们在读写例如XML和TXT文件的时候,在电脑上和手机上路径不一致,造成了很多麻烦, ...

  2. RPM常用组合【转载】

    RPM常用组合 -ivh:安装显示安装进度--install--verbose--hash -Uvh:升级软件包--Update: -qpl:列出RPM软件包内的文件信息[Query Package ...

  3. 反转字符串--C和Python

    将字符串反转,即“abcde”->"edcba" C语言实现: [转自http://www.kanzhun.com/mianshiti/456.html?sid=mail_1 ...

  4. virsh常用命令

    必须启动libvirtd,才能用virsh查看kvm后台. # systemctl start libvirtd 查看网络 # virsh net-list 启动default网络 # virsh n ...

  5. Resumable uploads over HTTP. Protocol specification

    Valery Kholodkov <valery@grid.net.ru>, 2010 1. Introduction This document describes applicatio ...

  6. Couchbase 介绍 - 更好的 Cache 系统

    在移动互联网时代,我们面对的是更多的客户端,更低的请求延迟,这当然需要对数据做大量的 Cache 以提高读写速度. 术语 节点:指集群里的一台服务器. 现有 Cache 系统的特点 目前业界使用得最多 ...

  7. CentOS6.5以runlevel 3开机时自动连接某无线设置示例

    [参考]http://blog.csdn.net/simeone18/article/details/8580592 [方法一] 假设无线网卡代号为wlan0,无线AP的essid为:TheWiFi, ...

  8. object-c面向对象1

    ---恢复内容开始--- 类,对象,方法,属性. 类是object-c一种重要的数据类型,是组成object-c程序的基本要素.object-c的类声明和实现包括两个部分:接口和实现部分. @inte ...

  9. iOS category中的所谓属性 和 从xib初始化对象的方法 以及类扩展

    今天在编码时遇到以下代码 @interface UITextField (TCCustomFont) @property (nonatomic, copy) NSString* fontName; @ ...

  10. LightOJ 1315 - Game of Hyper Knights(博弈sg函数)

    G - Game of Hyper Knights Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%lld & ...