Ext文件上传事例

一.文件上传表单定义

 

		rms.custManage.custAbnormalApplyDetailUploadPanel = Ext.extend(Ext.FormPanel,{
			labelAlign : 'right',
			buttonAlign:'center',
			labelWidth : 65,
			height:80,
			frame : true,
			border : false,		
			layout : 'table',
			layoutConfig : {
				columns : 2
			},
			id:'custAbnormalApplyDetailUploadPanel',
			fileUpload : true,
			initComponent:function(){					
				this.items = [{
							layout : 'form',
							style : 'margin-top:5px;',
							items : [{
										xtype : 'textfield',
										fieldLabel : '附件区域',
										id : 'file',
										name : 'file',
										inputType : 'file',
										width : 300
									}]
						}, {
							layout : 'form',
							style : 'margin-left:10px;',
							items : [{
										xtype : 'button',
										text : '上传',
										width : 50,
										handler : uploadFile
									}]
						}, {
							colspan : 2,
							xtype : 'box',
							html : "<div id='docDiv'  style='font-size: " +
									"x-small;padding-left:70px;'>"+
									+ "</div>",
							autoHeight : true
						}];		
				// 初始化组件
				rms.custManage.custAbnormalApplyDetailUploadPanel
										.superclass.initComponent.call(this);
			}
		})

    注意点： 1.Ext.form.TextField 中设置 inputType:'file';
                   2.form里面的fileUpload设置为true;

 

二. 表单提交处理

 

	uploadForm.getForm().submit({
			method : 'post',
			url : ctx
					+ '/pages/custManage/custAbnormalUpload.page',
			waitMsg : '文件正在上传中...',
						success : function(f, action) {
			},
			failure : function() {
			}
		});

 

三. 后台控制处理

 

@RequestMapping("/pages/custManage/custAbnormalUpload.page")
public void uploadFile(HttpServletRequest request,
		HttpServletResponse response) throws Exception {	
	// 上传文件获取
	MultipartHttpServletRequest multipartRequest = 
							   (MultipartHttpServletRequest) request;
	CommonsMultipartFile file = (CommonsMultipartFile)
							   multipartRequest.getFile("file");	
    // 存放文件的绝对路径
	DataOutputStream out = new DataOutputStream(new FileOutputStream(filePath));
	InputStream is = null;// 附件输入流
	try{
		is = file.getInputStream();			
		byte[] buffer = new byte[1024];
		while (is.read(buffer) > 0) {
			out.write(buffer);// 写入磁盘；
		}
	}catch(Exception e){
		throw e;
	}finally{
		if (is != null) {					
			is.close();
		}
		if (out != null) {
			out.flush();
			out.close();
		}
	}
	return null;
}

 

  注意点：保存到数据库需保存其原始文件名和存放路径（存放路径的文件名以随机的时间为文件名）