ExtJs4 多附件上传组件

之前看了czpae86关于多附件上传的组件UploadPanel（http://czpae86.iteye.com/blog/1728408），自己下载后发现运行一直失败，
主要有以下两个问题：
1.后台无法接收到参数；
2.处理完成第一个问题后可以上传，但是上传完成后关闭窗口后会报错。
通过查看源代码得知第一个问题是因为upload_start_handler方法中调用了setFilePostName方法，这样导致后台的接收参数会动态变化（根据上传文件的名字）。所以这个方法最好去掉，我的这个方法如下：

var me = this.settings.custom_settings.scope_handler;
me.down('#cancelBtn').setDisabled(false);

然后在getSWFConfig的return中增加如下配置：

file_post_name: 'file'

这样我后台的接收名字就固定为file。具体可以参照uploadPanel中的后台代码。
第二个问题比较偶然，onRemove方法刚好和extjs默认销毁调用的方法重名导致。解决方案就是修改该方法的名字，例如onRemoveAll.另外重写beforeDestroy方法，将store置空：

beforeDestroy: function() {
        var me = this;
       me.store.removeAll();
        Ext.destroy(
            me.placeholder,
            me.ghostPanel
        );
        me.callParent();
    }

根据以上问题修改后的代码见附件。需要把uploadPanel中的Ext.define后的XX修改为自己的项目名称。UploadPanel中的upload_url修改为实际的上传action，uploadSuccess方法中从后台的返回值根据你的实际POJO类修改。

调用的话使用如下代码：

var uploadWin = Ext.create('XX.view.ux.UploadWin',{
	callback: function(file){
	    if (file != null){
		store.add(file);
	    }
	    uploadWin.close();
	},
	scope: this
}).show();

评论

4 楼 jintt123 2016-11-02  

你好！我后台用的是C#一直上传失败，一直取不到后台参数，求解

3 楼 yajian_he 2016-03-29  

你好，我使用之后发现选择文件按钮点击无效，需要点击这个按钮右边边缘才能进入文件选择，能帮我解答下吗？

2 楼 xinjie2009 2015-08-11  

joesph 写道

swfupload文件夹放在什么位置？怎么引用swfupload.js？谢谢

这个看你自己的项目，我的项目是放在根目录下的，引用js的话直接在html页面上
<script type="text/javascript" src="swfupload/swfupload.js"></script>
就可以了。

1 楼 joesph 2015-07-30  

swfupload文件夹放在什么位置？怎么引用swfupload.js？谢谢