我是靠谱客的博主 开朗灯泡,最近开发中收集的这篇文章主要介绍Struts2+ibatis+dwz 框架实现uploadify上传文件,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

  1. 下载js包 (3.2版本)

下载地址:http://www.uploadify.com/download/

解压后文件:

jsp页面

<div class="pageContent">
<style>
.fileQueue li{margin:5px auto;padding:2px 15px 2px;width:85%;height:30px;line-height:30px;font-size:14px;border:1px dashed #C1C1C1;overflow:hidden;cursor:pointer}
.fileQueue li:hover{border:1px solid #F00;background:url(themes/default/images/btn/remove.gif) #E9C341 no-repeat right 50%;}
</style>
<link href="themes/uploadify/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="themes/uploadify/jquery.uploadify.min.js"></script>
<script src="themes/js/jquery-1.7.2.js" type="text/javascript"></script>
<script type="text/javascript">
	
	$(document).ready(function (){
		var $panel = navTab.getCurrentPanel();
		
		//var uploadObj = $("#trFileInit input[name=uploadFile]");
		//$(uploadObj).uploadify(uploaderOption);
		
		var htmlFile = $("#TypeTemplet", $panel).find("tbody").html();
		
		var docTypeNum = 0;//类型行计数
		
		//新增行
		$("input[name=addType]", $panel).click(function() {
			var $this = $(this);
				
			docTypeNum++;
			var inputFile = "<input type="file" name="uploadFile" id="file_{docTypeNum}" /><div id="fileQueue_{docTypeNum}" class="fileQueue"><ol></ol></div><input type="hidden" name="fileCount" id="fileCount_{docTypeNum}" class="required" mingt="0" title="请上传文件" value="0"/><input type="hidden" name="fileName" id="fileName_{docTypeNum}" class="required" value="" />";
			
			inputFile = inputFile.format({
				"docTypeNum" : docTypeNum
			});
			
			var $tr = $(htmlFile).initUI();
			$(".tdFile",$tr).append(inputFile);
			$this.parent().parent().before($tr);
			
			var uploadObjAdd = $("input[name=uploadFile]",$tr);
			
			var uploaderOption={
					'formData' : {'docTypeNum' : docTypeNum},
					'swf'      : 'themes/uploadify/uploadify.swf',
					'uploader' : 'singleFileUpload_uploadOneFile.action',
					'multi': true,              // 是否支持同时上传多个文件  
					'auto': true,  			    //设置为true当选择文件后就直接上传了,为false需要点击上传按钮才上传 。
					'fileObjName' : 'uploadFile',   //文件对象名称,用于后台获取文件对象时使用
					'buttonImage': 'themes/uploadify/bottonImage.png', //浏览按钮的图片
					'height': '20',
					'width' : '80',
					'removeTimeout' : '1', //上传完成后从队列移除的时间 
					'progressData':"percentage", //有speed和percentage两种,一个显示速度,一个显示完成百分比 
					//'queueID': queueID,     //文件队列的ID,该ID与存放文件队列的div的ID一致
					'preventCaching':true,		//后缀加随机数,防止缓存
			        'requeueErrors':false,		//上传出现错误后,重新加入队列
			        'successTimeout':30,		//等待服务器响应时间,超过30秒认为上传完成
					'onFallback':function(){    
			            alert("您未安装FLASH控件,无法上传文件!请安装FLASH控件后再试。");    
			         },
			        'onUploadSuccess': function(file,data,response){
				 		var objResult = jQuery.parseJSON(data);
				 		
			            //TODO:展示相应上传文件,以便用户知晓目前已经上传了哪些文件
			            var fileHtml = "<li title="点击删除该文件">{uploadFileOriginName}<input type="hidden" name="docTypeNum" value="{docTypeNum}" /><input type="hidden" name="uploadFileRelativePath" value="{uploadFileRelativePath}" /><input type="hidden" name="uploadFileAbsolutePath" value="{uploadFileAbsolutePath}" /></li>";
			            fileHtml = fileHtml.format({
			            	docTypeNum : docTypeNum,
			            	uploadFileOriginName : objResult.uploadFileOriginName,
			            	uploadFileRelativePath : objResult.uploadFileRelativePath,
			            	uploadFileAbsolutePath : objResult.uploadFileAbsolutePath
			            });
				        
			            $("#fileQueue_" + objResult.docTypeNum + " ol").append(fileHtml);
			            
				        // 每次上传文件重新赋值文件名
				        var fileName = $("#fileName_" + objResult.docTypeNum);
				        fileName.val(fileName.val() + objResult.uploadFileAbsolutePath + ",");
				        
				        //每一个文件类型上传文件计数
				        var fileCount = $("#fileCount_" + objResult.docTypeNum);
				        fileCount.val(parseInt(fileCount.val())+1);
			 		},
			 		'onInit'   : function(instance) {
			 			
			        },
			 		'onUploadError' : function(file, errorCode, errorMsg, errorString) {
			         //  alert(file.name + "文件上传失败 : " + errorString);
			        },
			        /* 'onDialogClose'  : function(queueData) {
			            alert("队列中提交了 "+queueData.filesQueued +"个文件 !");
			        }, */
			        'onQueueComplete' : function(queueData) {
			            //alert(queueData.uploadsSuccessful + "个文件上传成功," + queueData.uploadsErrored + "个文件上传失败!");
			            //$("#count").val(queueData.uploadsSuccessful);
			        }
				};
			$(uploadObjAdd).uploadify(uploaderOption);
		});
		//新增每一个li绑定click事件  上传文件删除,文件名称重新赋值
		$("li").live("click", function () {
			var file = $(this).find("input[name=uploadFileAbsolutePath]").val();
			var Type = $(this).find("input[name=docTypeNum]").val();
			var fileName = $("#fileName_" + Type);
			var fileNameVal = fileName.val();
			var fileNames = fileNameVal.substring(0,fileNameVal.length-1).split(",");
			var fileNas = "";
			
			for(var i = 0 ; i < fileNames.length ; i++){
				if(file != fileNames[i]){
					fileNas += fileNames[i] + ",";
				}
			}
			
			$(this).remove();
			fileName.val(fileNas);
		});

	});
</script>

	<form method="post" action="xxxxxxxxxxx_upload.action" class="pageForm required-validate" enctype="multipart/form-data"
		οnsubmit="return iframeCallback(this, navTabAjaxDone);">
        <div class="tableList" layouth="33">
            <table class="tbl w750" width="750">
                <thead>
                    <tr>
                        <th colspan="3">新增签约信息</th>
                    </tr>
                </thead>
                <tbody>
                	
					<tr>
					<tr class="type">
						<td colspan="2" class="regDetailSort">选择类型与文件</td>
					</tr>
					<tr class="type">
						<td colspan="2">
							<table style="width: 99%;margin:0 auto;">
								<thead>
									<tr>
										<td width="40%" class="c">选择类型</td>
										<td width="40%" class="c">上传文件</td>
										<td class="c">操作</td>
									</tr>
								</thead>
								<tbody>
									<tr>
										<td colspan="3" class="c"><input type="button" name="addType" class="btnAdd" value="增加一行" /></td>
									</tr>
								</tbody>
							</table>
						</td>
					</tr>
					
                </tbody>
            </table>
        </div>
        <div class="panelBar toolBarBtn">
 	        <input type="submit" name="btnSave" class="btnSave" value="保存" target="ajaxTodo" title="确定要保存吗?" />
        </div>
    </form>
</div>

<div style="display:none;">
	<table id="TypeTemplet" style="width:99%;">
		<tbody>
			<tr>
				<td><djctag:parameter_select pmCode="AC0037" name="docType" required="true" all="true" allTipsText="请选择类型" /></td>
				<td class="tdFile">
				</td>
				<td><input type="button" name="btnDel" value="删除" style="height: 20px;cursor:pointer" class="deleteRow btnDel"/></td>
			</tr>
		</tbody>
	</table>
</div>

Action 文件上传处理
public class SingleFileUploadAction extends BaseAction {

	private static final long serialVersionUID = -1937371053388726125L;

	//上传文件
	private File uploadFile; 
	
	//上传文件名(上传前原文件名,不含路径)
	private String uploadFileFileName;
	//上传文件内容类型
	private String uploadFileContentType;
	
	private String docTypeNum;
	
	File toFile = null;
	String toFileName;
	
	/*上传文件保存目录*/
	private static String UPLOAD_BASE = SysConfig.getInstance().get("UPLOAD_BASE");
	/*上传文件保存子目录:按照日期生成*/
	private String UPLOAD_SUB_FOLDER = DateTimeUtils.getSystemDate("yyyy/MM/dd/");
	
	/**
	 * 上传文件
	 * @return
	 * @throws BusinessException
	 */
	public String uploadOneFile() throws BusinessException {
		try {
			if (uploadFile == null) {
				throw new BusinessException("未找到上传文件!");
			}

			Log.logDebug("t上传文件: " + uploadFile + "ntt上传文件名: " + uploadFileFileName + "ntt上传文件类型: " + uploadFileContentType);
			// 根据系统时间生成上传够保存的文件名
			String prefix = DateTimeUtils.getSystemTime("yyyyMMddHHmmssSSS");
			toFileName = prefix + "." + getFileExtionName(uploadFileFileName);

			toFile = new File(getSavePath(), toFileName);
			if (!toFile.getParentFile().exists()) {
				toFile.getParentFile().mkdirs();
			}
			Log.logDebug(toFile);
			try {
				FileUtils.copyFile(uploadFile, toFile);
			} catch (IOException e) {
				throw new BusinessException("文件读取失败!", e);
			}
			
			request.setAttribute("uploadFileOriginName", uploadFileFileName);//上传文件原名称
			request.setAttribute("uploadFileSavedName", toFileName);		//上传文件新名称
			request.setAttribute("uploadFileContentType", uploadFileContentType);//上传文件内容类型
			request.setAttribute("uploadFileRelativePath", this.getUploadFileRelativePath());//上传文件保存相对路径
			request.setAttribute("uploadFileAbsolutePath", StringEscapeUtils.escapeJava(this.getUploadFileAbsolutePath()));//上传文件保存绝对路径
			request.setAttribute("docTypeNum", docTypeNum);
		} catch (BusinessException e) {
			e.printStackTrace();
			String message = null;
			ExceptionHandler exceptionHandler = new ExceptionHandler();
			message = exceptionHandler.getBusinessExceptionMessage(e);
			request.setAttribute("statusCode", "500");
			request.setAttribute("message", message);
			return "upload-fail";
			/*throw e;*/
		} catch (Exception e) {
			e.printStackTrace();
			request.setAttribute("statusCode", "500");
			request.setAttribute("message", "文件读取失败!");
			return "upload-fail";
		}	
		
		return "upload-success";
	}
	
	/**
	 * 方法描述:得到文件的拓展名
	 *  
	 * @param fileName
	 * @return 返回文件拓展名,无扩展名则返回“”
	 */
	public String getFileExtionName(String fileName) {
		if(StringUtils.isEmpty(fileName)){
			return "";
		}
		
		int dotIndex = fileName.lastIndexOf(".");
		if (dotIndex > 0) {
			return fileName.substring(dotIndex + 1);
		} else {
			return "";
		}
	}
	
	private String getSavePath() {
		String uploadDir = UPLOAD_BASE + UPLOAD_SUB_FOLDER;
		return uploadDir;
	}
	
	
	/**
	 * 方法描述: 获取上传文件存储相对路径
	 * @return 上传文件存储相对路径
	 */
	public String getUploadFileRelativePath() {
		return UPLOAD_SUB_FOLDER + toFileName;
	}
	
	/**
	 * 方法描述: 获取上传文件存储绝对路径
	 * @return 上传文件存储绝对路径
	 */
	public String getUploadFileAbsolutePath() {
		return this.toFile.getAbsolutePath();
	}

	public File getUploadFile() {
		return uploadFile;
	}

	public void setUploadFile(File uploadFile) {
		this.uploadFile = uploadFile;
	}


	public String getUploadFileFileName() {
		return uploadFileFileName;
	}

	public void setUploadFileFileName(String uploadFileFileName) {
		this.uploadFileFileName = uploadFileFileName;
	}

	public String getUploadFileContentType() {
		return uploadFileContentType;
	}

	public void setUploadFileContentType(String uploadFileContentType) {
		this.uploadFileContentType = uploadFileContentType;
	}

	public String getDocTypeNum() {
		return docTypeNum;
	}

	public void setDocTypeNum(String docTypeNum) {
		this.docTypeNum = docTypeNum;
	}
}



 
 
Action 保存
<span style="white-space:pre">	</span>public String upload(){
		//int[] fileCount = super.getIntParameterValues("fileCount");	
		String[] fileName = super.getParameterValues("fileName");	
		String[] docType = super.getParameterValues("docType");	
		
		signBiz.signAdd(doc, fileName, docType, user);
		return "upload";
	}
</pre><pre name="code" class="java">效果图




 
 

最后

以上就是开朗灯泡为你收集整理的Struts2+ibatis+dwz 框架实现uploadify上传文件的全部内容,希望文章能够帮你解决Struts2+ibatis+dwz 框架实现uploadify上传文件所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(66)

评论列表共有 0 条评论

立即
投稿
返回
顶部