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