Extjs4——为filefield组件设置选择多文件上传

Extjs4提供的文件上传控件filefield只提供了单文件上传,并不能同时上传多个文件,下面逐步说明一下如何改造filefield控件让它支持多文件:

 

1、为filefield组件添加支持多文件选择属性

multipleFn: function($this){

         var typeArray = ["application/x-shockwave-flash","audio/MP3","image/*","flv-application/octet-stream"];

         var fileDom = $this.getEl().down('input[type=file]');

         fileDom.dom.setAttribute("multiple","multiple");

         fileDom.dom.setAttribute("accept",typeArray.join(","));

}

 

2、为filefield组件添加两个监听事件

 

1)afterrender——即组件渲染之后,重写该组件使其支持多文件选择

afterrender: function(){

this.multipleFn(this);

}

 

2)change——即获取文件列表并做好页面回显,组件的值发生改变之后,组件会还原,需要再次重写

change: function(){

var fileDom = this.getEl().down('input[type=file]'); 

var files = fileDom.dom.files; 

var str = ''; 

for(var i = 0;  i < files.length;  i++){

 str += files[i].name;

 str += ' ';

 Ext.getCmp('files').setRawValue(str);    //files为组件的id

 

 this.multipleFn(this);

}

https://blog.csdn.net/a94522538/article/details/52325980

发布了391 篇原创文章 · 获赞 181 · 访问量 163万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 精致技术 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览