upload_excel.jsp 4.2 KB
<%@page import="com.framework.util.PropertiesLoader"%>
<%@page import="org.apache.commons.lang3.StringUtils"%>
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>

<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/resource/library/css/upload.css">

<%
	String uploadIndex=request.getParameter("uploadIndex");//唯一键
	String uploadFieldName=request.getParameter("uploadFieldName");//文件名称字段
	String uploadFileSizeLimit=request.getParameter("uploadFileSizeLimit");//文件大小限制
	String uploadFileTypeExts=request.getParameter("uploadFileTypeExts");//文件格式设计
	String uploadFileTypeDesc=request.getParameter("uploadFileTypeDesc");//文件上传描述
	if(StringUtils.isBlank(uploadFileTypeDesc)){
		uploadFileTypeDesc = "Excel文件";
	}
%>

<input id="file_upload_<%=uploadIndex%>" name="file_upload" type="file" multiple="true" style="display: none"/>
<div id="uploadFileDiv_<%=uploadIndex%>"><input type='hidden' class='upload_<%=uploadFieldName%>' name='<%=uploadFieldName%>' value=''/></div>
<div id="statusContent_<%=uploadIndex%>"></div>		

<script type="text/javascript">         
	$('.cancelButton').click(function(e) {
   		$('#statusContent_<%=uploadIndex%>').html("<input type='hidden' class='upload_<%=uploadFieldName%>' name='<%=uploadFieldName%>' value=''/>");
   	});
   	function cancelItem(instanceID,fileID){
   		$('#'+instanceID).uploadify('cancel', fileID);
   		$('#uploadFileDiv_<%=uploadIndex%>').html("");
		$('#statusContent_<%=uploadIndex%>').html("<input type='hidden' class='upload_<%=uploadFieldName%>' name='<%=uploadFieldName%>' value=''/>");
   	}  
   	function addFormItem(fileId,filePath){
   		$('#statusContent_<%=uploadIndex%>').html('');
   		var html="<input class='upload_<%=uploadFieldName%>' type='hidden' id='form_img_"+fileId+"' name='<%=uploadFieldName%>' value='"+filePath+"'/>";
   		$('#uploadFileDiv_<%=uploadIndex%>').html(html);
   	}
   	function initImgUpload(){
   		var itemTemplate = '<div id="\${fileID}" class="uploadify-queue-item">';
   		itemTemplate+='<div class="cancel">';
   		itemTemplate+='<a class="cancelButton" href="javascript:cancelItem(\'\${instanceID}\', \'\${fileID}\',\'<%=uploadIndex%>\')">X</a>';
   		itemTemplate+='</div>';
   		itemTemplate+='<span class="fileName">';
   		/* itemTemplate+='<img src="library/images/image.png">'; */
   		itemTemplate+='\${fileName} (\${fileSize})</span><span class="data"></span>';
   		itemTemplate+='<div class="uploadify-progress">';
   		itemTemplate+='<div class="uploadify-progress-bar"></div>';
   		itemTemplate+='</div>';
   		itemTemplate+='</div>';
   		var lastSelId;
   		function onSelNew(){
   			if(lastSelId){
   				cancelItem('file_upload_<%=uploadIndex%>',lastSelId);
   			}
   		}
   		$('#file_upload_<%=uploadIndex%>').uploadify({
   			'swf'      : '<%=request.getContextPath()%>/resource/library/js/uploadify/uploadify.swf',
   			'uploader' : '<%=request.getContextPath()%>/dropUpload?fileSize=<%=uploadFileSizeLimit%>',
   			'buttonText':'<div style="background:#2291ff" class="buttonText">选择上传<div>',
   			'onUploadSuccess' : function(file, data, response) {
   				lastSelId = file.id;
   				addFormItem(file.id,data);
   	        },
   	        'onSelect':onSelNew,
   	        'queueSizeLimit':1,
   	        'fileSizeLimit' : '<%=uploadFileSizeLimit%>MB',
   	        'multi':false,
   	        'fileTypeDesc' : '<%=uploadFileTypeDesc%>',
   	        'fileTypeExts' : '<%=uploadFileTypeExts%>',
   	        'itemTemplate' : itemTemplate,
   	        'removeCompleted':false,
   	        'onUploadError' :function(file,errorCode,errorMsg,errorString){
   	           $.getJSON("<%=request.getContextPath()%>/doCheckError",function(result){
   				 if(''!=result){
   		        	cancelItem("file_upload_<%=uploadIndex%>",file.id);
   		        	if('1'==result){
   		        		alert("文件格式错误!");
   		        	}else{
   			        	alert("文件大小不能超过<%=uploadFileSizeLimit%>MB");			        		
   		        	}
   				 }
           	   });	        	
   	        }
   		});
   	}
   $(function() {
   		initImgUpload();
   	});
</script>