JavaBean(用于DWR与前台传值)
public class UploadInfo {
private List<Long> hasUpload = new ArrayList<Long>();
private List<Long> totalSize = new ArrayList<Long>();
getter and setter....
}
处理上传的Action
@Override
public String execute() throws Exception {
DocumentCatalog catalog = catalogServie.getDocumentCatalog(catalogId);
List<DocumentItem> list = new ArrayList<DocumentItem>();
DocumentItem item = null;
Date date = new Date();
String type;
String fileName;
File f = null;
// long totalSize = 0;
// for(File ss : file){
// totalSize += ss.length();
// }
//设置进度条所需要的信息
//这个对象不可以在循环中声明,要不每一次取得到值都是为空
UploadInfo uploadInfo = new UploadInfo();
for (int i = 0; i < file.size(); ++i) {
item = new DocumentItem();
fileName = fileFileName.get(i);
f = file.get(i);
item.setCatalog(catalog);
item.setCreateDate(date);
item.setRealSize(f.length());
item.setName(fileName);
type = FileUtils.getFileExtName(fileName, false);
item.setType(type);
item.setSize(FileUtils.getStringSize(f.length()));
item.setRandomName(FileUtils.getRandomFileName(5)+"."+type);
String separator = File.separator;
// 文档的路径
String itemStorage = FileStorage.getDocumentItemStoragepath(ServletActionContext.getRequest());
// 创建上传文件
File upload = new File(itemStorage + separator + catalogId + separator + item.getRandomName());
// 如果目录不存在,强制创建该目录,而在JAVA中目录和文件是一样的,所以创建上一层的目录就可以了
org.apache.commons.io.FileUtils.forceMkdir(upload.getParentFile());
//uploadInfo.setTotalSize(totalSize);
uploadInfo.getTotalSize().add(f.length());
//先存一个值,要不下面写hasUpload的时候会出错!
uploadInfo.getHasUpload().add(0L);
ServletActionContext.getRequest().getSession().setAttribute("uploadInfo", uploadInfo);
InputStream is = new FileInputStream(f);
byte[] buffer = new byte[1024];
int len = 0;
OutputStream os = new FileOutputStream(upload);
while (-1 != (len = is.read(buffer))) {
//Thread.sleep(10);
os.write(buffer, 0, len);
//设置已读的值
uploadInfo.getHasUpload().set(i, uploadInfo.getHasUpload().get(i)+len);
}
is.close();
os.close();
// 保存文档
list.add(item);
}
ServletActionContext.getRequest().getSession().removeAttribute("uploadInfo");
this.service.addDocumentItems(catalog, list);
return SUCCESS;
}
JSP代码
<tr>
<td colspan="2">
<div id="bar" style="display:none;">
</div>
</td>
</tr>
JS代码:
<script type="text/javascript"> var count=0; //动态添加的文档计数器 var num=1; var maxUploadFileCount = 4; //动态可添加要上传的文档数量 function addMore(){ if(count == maxUploadFileCount){ alert("一次上传不能超过"+(maxUploadFileCount+1)+"个文档"); return ; } var theTd = document.getElementById("td"); var br = document.createElement("br"); var obj = document.createElement("input"); var button = document.createElement("input"); obj.type = "file"; obj.name = "file"; obj.id = "file"+ ++num; obj.size = 40; button.type = "button"; button.value = "删除文件"; button.onclick = function(){ theTd.removeChild(button); theTd.removeChild(obj); theTd.removeChild(br); --count; }; theTd.appendChild(br); theTd.appendChild(obj); theTd.appendChild(button); ++count; } function validate(){ var theTr = document.getElementById("tr"); var firstFile = document.getElementById("file") ; if(firstFile!=null && firstFile.value.length==0){ alert("不能有留空的上传选项!"); return false; } for(var i=0;i<num;++i){ var file = document.getElementById("file"+num); if(file!=null && file.value.length==0){ alert("不能有留空的上传选项!"); return false; } } var inputs = document.getElementsByTagName("input"); for(var i=0;i<inputs.length;++i){ var type = inputs[i].type; if( type=="button" || type=="submit" || type=="reset"){ inputs[i].disabled = true; } if(type=="file"){ inputs[i].readOnly=true; } } startUpload(); return true; } function startUpload(){ var outerDiv = document.getElementById("bar"); var fileArray = new Array(); var inputs = document.getElementsByTagName("input"); for(var i=0;i<inputs.length;++i){ if(inputs[i].type == "file"){ var fileName = inputs[i].value; var index = fileName.indexOf("\\"); if(-1 == index){ index = fileName.indexOf("/"); } fileName = fileName.substring(index+1,fileName.length); fileArray.push(fileName); } } for(var i=0;i<count+1;++i){ var numDiv = document.createElement("div"); var fileName = fileArray[i]; if(fileName.length>35){ fileName = fileName.substring(0,35)+"..."; } fileName +=" " numDiv.id = "num"+i; numDiv.innerHTML = i+1+": "; numDiv.style.cssFloat = "left"; //针对FF numDiv.style.styleFloat = "left"; //针对IE var nameDiv = document.createElement("div"); nameDiv.id = "name"+i+1; nameDiv.style.cssFloat = "left"; //针对FF nameDiv.style.styleFloat = "left"; //针对IE nameDiv.style.width="320px"; nameDiv.innerHTML = fileName; // <div id="bar" style="width: 300px; height: 20px; border: 1px; background: #eee; float: left;"> // <div id="processBar" style="width: 0px; height: 20px; background: green;"></div> // </div> var innerDiv = document.createElement("div"); innerDiv.style.width = "300px"; innerDiv.style.height = "20px"; innerDiv.style.border = "1px"; innerDiv.style.background = "#eee"; innerDiv.style.cssFloat = "left"; //针对FF innerDiv.style.styleFloat = "left"; //针对IE var processBarDiv = document.createElement("div"); processBarDiv.id = "processBar"+i; processBarDiv.style.width = "0px"; processBarDiv.style.height = "20px"; processBarDiv.style.background = "green"; // processBarDiv.style.cssFloat = "left"; //针对FF // processBarDiv.style.styleFloat = "left"; //针对IE var rateDiv = document.createElement("div"); rateDiv.id = "rateDiv"+i; rateDiv.innerHTML = " "+"0%"; outerDiv.appendChild(numDiv); outerDiv.appendChild(nameDiv); innerDiv.appendChild(processBarDiv); outerDiv.appendChild(innerDiv); outerDiv.appendChild(rateDiv); } window.setTimeout("startProcess()",200); } function startProcess(){ uploadInfoListener.getUploadInfo(showProcessBar); } function showProcessBar(data){ var process = 0; var barBox = document.getElementById("bar"); barBox.style.display = "block"; var test = document.getElementById("test"); for(var i=0;i<count+1;++i){ process=data.hasUpload[i]/data.totalSize[i]*100; if(isNaN(process)){ if(data.hasUpload[i]>0){ process=100; }else{ process=0; } } var processRate = document.getElementById("rateDiv"+i); processRate.innerHTML = Math.floor(process)+"%"; var processBar = document.getElementById("processBar"+i); processBar.style.width= process*3+"px"; test.innerHTML="hasUpload="+data.hasUpload[i]+"<br>totalSize="+data.totalSize[i]+"<br>Process="+process; } window.setTimeout("startProcess()",200); } </script>