日期:2014-05-16  浏览次数:20501 次

Extjs--关于文件的上传

        这几天要做一个页面的上传和下载,从年前一直纠结到现在,一直以为是Extjs基础下的上传下载,其实与Extjs基本没有什么关系,只是一直思维被局限于Extjs界面的缘故。听说Extjs4.0有对应的控件,由于目前公司项目非4.0,所以目前暂未实现过,下面记录一下自己目前总结的解决办法。


上传:

{
							        xtype : 'textfield',
							        fieldLabel : '上传文件',
							        name : 'userfile',
							        id : 'userfile',
							        inputType : 'file',
							        width : 300,
							        height : 20
							        //emptyText: '请选择上传文件...'    不知道为什么 这两个参数在IE8下都是无效的
							       // blankText : 'File can\'t not empty.'
				        		}

由一个Button触发上传:

{
			        			xtype : 'button',
						        text : '上传',
						        name : 'doc_upbut',
						        id : 'doc_upbut',
						        handler : function() {
							       if (form.form.isValid()) {
							       var upFile = Ext.getCmp('userfile').getValue();
							        if(upFile == ''){
							         Ext.Msg.alert('错误','请选择你要上传的文件');
							         return;
							        }
							         var upFileLastName = upFile.toString();
							         var LastNames = upFileLastName.split("\.")
							         if(LastNames[LastNames.length-1] == ("exe")){
							         	Ext.Msg.alert('错误','不支持该类型文件!');
							         	return;
							         }
							         var file_up = document.getElementById('userfile');
							         file_up.select(); 
							         var realpath = document.selection.createRange().text; 
							         realpath = encodeURIComponent(realpath);//IE8以上会出现一个虚拟路径,在此要获取真实路径
							         Ext.MessageBox.show({
							           title : '请稍等',
							           msg : '文件正在上传...',
							           progressText : '',
							           width : 300,
							           progress : true,
							           closable : false,
							           animEl : 'loding'
							          });
							        
							         Ext.Ajax.request({
										    url : '../control/IndexDocument?act=updateLoad',
										   	params : {
										       filePath : realpath,
										       fatherPath :doc_majorCode
										   	},
										   	method: 'POST',
									       	success: function (request ) {
												var resp=Ext.util.JSON.decode(request.responseText);
												if(resp.success == 'fail'){
													Ext.Msg.alert('信息','<center>上传失败!<p>'+ resp.Info+'</center>');
												}
												else{
													Ext.Msg.alert('提示', '上传成功!');
													doc_store.reload();
													doc_grid.getView().refresh();
													doc_store.commitChanges();
													
												}
									       	},			
										   	failure: function ( result, request) { 
											        Ext.Msg.alert('错误','上传时出现未知错误.'); 
										   	} 
								});   
						       }
						      }}


handler处理:

	public String updateLoad(HttpServletRequest request,HttpServletResponse response) {
		String jsonData = "";
		String frompage = "";
		try {
			String path = request.getSession().getServletContext().getRealPath(rootDir);
			String filePath = URLDecoder.decode(request.getParameter("filePath"),"utf-8");
			String fatherPath = request.getParameter("fatherPath");
			frompage= (request.getParameter("frompage") != null)? request.getParameter("frompage") : "";
			jsonData = docUtil.updateLoad(filePath,fatherPath,path);
		} catch (UnsupportedEncodingException e) {
			e.printStackTrace();
			jsonData = e.getMessage();
		}
		if (!jsonData.equalsIgnoreCase("")) { 
			jsonData = "{success:'fail',Info:'" + jsonData + "'}";
		} else {
			jsonData = "{success:'success',Info:'上传成功!'}";
		}
		request.setAttribute("jsonData", jsonData);
		if(frompage.equals("")){
			return "extDataPage";
		}else if(f