將上傳組件uploadify封裝成jsp的tag標簽
package com.util.tag.html;import java.io.IOException; import java.io.Writer; import java.util.Random; import javax.servlet.jsp.JspException; import javax.servlet.jsp.tagext.BodyTagSupport;
import org.apache.struts2.ServletActionContext;
/**
- @author yao
/
public class UploadifyTag extends BodyTagSupport {
//項目路徑
private String basePath = null; //必填
//input type=file 元素
private String id = null;
private String name = null;
//form 表單
private String formID = null; //必填
//auto=false時上傳button的ID
private String uploadButtonId = null;
//屬性
private String fileTypeExts = ""; //必填 //文件過濾
private String fileSizeLimit = "2MB";//必填 //文件上傳大小
private String fileObjName = "file"; //必填 //后臺接收的名字
private String buttonClass = "button";
private String fileTypeDesc = "Upload Files"; //文件描述
private String method = "POST";
private String swf = "plugin/uploadify/uploadify.swf";
private boolean removeCompleted = true;
private boolean auto = true;
private boolean overideUploadStart = false;
private boolean multi = false;
private int uploadLimit = 1 ;
private int queueSizeLimit = 1;
private String queueHeight = "30px";
private String uploader = null; //上傳路徑
private String queueID = null; //進度條展示區域ID
//方法
private String uploadStart = null;
private String uploadSuccess = null;
private String onSelect = null;
private String onUploadComplete = null;
private boolean onlyLibs = false;
//jquery跟uploadify文件地址
private String jqlibs = "plugin/jquery-1.7.1.min.js";
private String uploadifyjs = "plugin/uploadify/jquery.uploadify-3.1.js";
private String uploadifycss = "plugin/uploadify/uploadify.css";
/**
- 主入口方法 */ @Override public int doStartTag() throws JspException { Writer writer = this.pageContext.getOut(); String path = basePath ; id = (id==null)?getFileElementId():id; StringBuffer totalStr = getLibs(path); if(!onlyLibs){ StringBuffer js = getJS(path, id, uploadButtonId); StringBuffer fileElement = getFileElement(id); totalStr = totalStr.append(js.append(fileElement)); } try { writer.write(totalStr.toString()); } catch (IOException e) { throw new JspException(e); } return super.doStartTag(); } /**
- 加載js庫
- @param path
- @return */ public StringBuffer getLibs(String path) { StringBuffer sb = new StringBuffer(); sb.append("<script type=\"text/javascript\" src=\"").append(path).append(jqlibs).append("\"></script>\n"); sb.append("<script type=\"text/javascript\" src=\"").append(path).append(uploadifyjs).append("\"></script>\n"); sb.append("<link type=\"text/css\" rel=\"stylesheet\" href=\"").append(path).append(uploadifycss).append("\">\n"); return sb; }
/**
- 拼裝js
- @param path 項目路徑
- @param id input type=file元素ID
- @param uploadButtonId 提交按鈕ID / public StringBuffer getJS(String path, String id, String uploadButtonId) { StringBuffer sb = new StringBuffer(); String tab = " "; sb.append("<SCRIPT LANGUAGE=\"JavaScript\">\n"); sb.append(tab).append("$(function() {\n"); //獲取form的action,用作uploader的跳轉地址 sb.append(tab).append("var uploader = $(\"#").append(formID).append("\").attr('action');").append("\n"); //uploadify開始 sb.append(tab).append("$(\"#").append(id).append("\").uploadify({ \n"); //uploadify屬性拼裝 sb.append(tab).append(tab).append("'fileTypeExts' : '").append(fileTypeExts).append("',\n"); sb.append(tab).append(tab).append("'fileSizeLimit' : '").append(fileSizeLimit).append("',\n"); sb.append(tab).append(tab).append("'fileObjName' : '").append(fileObjName).append("',\n"); sb.append(tab).append(tab).append("'buttonClass' : '").append(buttonClass).append("',\n"); sb.append(tab).append(tab).append("'fileTypeDesc' : '").append(fileTypeDesc).append("',\n"); sb.append(tab).append(tab).append("'method' : '").append(method).append("',\n"); sb.append(tab).append(tab).append("'swf' : '").append(path).append(swf).append("',\n"); sb.append(tab).append(tab).append("'removeCompleted' : ").append(removeCompleted).append(",\n"); if (null!=uploadButtonId){auto=false;} sb.append(tab).append(tab).append("'auto' : ").append(auto).append(",\n"); sb.append(tab).append(tab).append("'multi' : ").append(multi).append(",\n"); sb.append(tab).append(tab).append("'uploadLimit' : ").append(uploadLimit).append(",\n"); sb.append(tab).append(tab).append("'queueSizeLimit' : ").append(queueSizeLimit).append(",\n"); sb.append(tab).append(tab).append("'queueHeight' : '").append(queueHeight).append("',\n"); sb.append(tab).append(tab).append("'uploader' : "); if(null==uploader) {sb.append("uploader");} else{sb.append(uploader);} sb.append(" ,\n"); if(null!=queueID) sb.append(tab).append(tab).append("'queueID' : '").append(queueID).append("',\n"); sb.append(tab).append(tab).append("'onUploadStart' : function() {\n"); if (!overideUploadStart) {sb.append(tab).append(tab).append(tab).append("callSetting(getFormData").append(id).append("());\n");} else{sb.append(tab).append(tab).append(tab).append("callSetting(").append(uploadStart.replace(";", "")).append(")").append(";\n");}sb.append(tab).append(tab).append("}, \n"); sb.append(tab).append(tab).append("'onUploadSuccess' : function(file, data, response) {\n"); if(null != uploadSuccess) {sb.append(tab).append(tab).append(tab).append(uploadSuccess.replace(";", "")).append(";");};sb.append(tab).append(tab).append("}, \n"); sb.append(tab).append(tab).append("'onSelect' : function() {");if (null != onSelect) {sb.append(onSelect);} sb.append("},\n"); sb.append(tab).append(tab).append("'onUploadComplete' : function(file) {");if (null != onUploadComplete) {sb.append(onUploadComplete);}sb.append("},\n"); sb.append(tab).append(tab).append("'onError' : function (event,ID,fileObj,errorObj) {\n");sb.append(tab).append(tab).append(tab).append("alert(errorObj.type + ' Error: ' + errorObj.info);\n");sb.append(tab).append(tab).append("} \n"); //uploadify結束 sb.append(tab).append("});\n"); //動態設置formData屬性的值 sb.append(tab).append("var callSetting = function(data){"); sb.append("$(\"#").append(id).append("\").uploadify('settings','formData',eval('('+data+')'));};\n"); //獲取表單input元素的信息 sb.append(tab).append("var getFormData").append(id).append(" = function(){\n"); sb.append(tab).append(tab).append("var str = \"\";\n"); sb.append(tab).append(tab).append("$(\"#").append(formID).append("\").children(\":input\").each(function(){\n"); sb.append(tab).append(tab).append(tab).append("var name = $(this).attr(\"name\");\n"); //設置過濾信息 sb.append("if(name!='_eosFlowDataContext'&&name!='_eosFlowKey'){\n"); sb.append(tab).append(tab).append(tab).append("var value = $(this).val();\n"); sb.append(tab).append(tab).append(tab).append("str = str +\"'\"+name+ \"':'\" + value+\"',\"\n"); // sb.append("}"); sb.append(tab).append(tab).append("});\n"); sb.append(tab).append(tab).append("return \"{\"+str.substring(0,str.length-1)+\"}\";\n"); sb.append(tab).append("};\n"); //設置提交按鈕提交事件 if (null != uploadButtonId) {sb.append("$('#").append(uploadButtonId).append("').click(function(){$('#").append(id).append("').uploadify('upload','');});");} sb.append("});\n</SCRIPT>\n"); return sb; } /**
- @param id input type=file元素ID
- @return 返回拼裝完成后的input type=file 元素 */ public StringBuffer getFileElement(String id) { StringBuffer sb = new StringBuffer(); if (null == name) { name = id; } sb.append("<input type=\"file\" name=\"").append(name).append("\" id=\"").append(id).append("\" />"); return sb; }
/**
- @return 返回隨機input type=file元素id */ public String getFileElementId() { char[] str = { '0', '1', '2', '3', '4', '5', '6', '7', '8', '9' }; StringBuffer saveName = new StringBuffer(); saveName.append("fileUpload"); for (int n = 0; n < 4; n++) { saveName.append(str[new Random().nextInt(str.length)]); } return saveName.toString(); }
public String getBasePath() { return basePath; }
public void setBasePath(String basePath) { this.basePath = basePath; }
public String getId() { return id; }
public void setId(String id) { this.id = id; }
public String getName() { return name; }
public void setName(String name) { this.name = name; }
public String getFormID() { return formID; }
public void setFormID(String formID) { this.formID = formID; }
public String getUploadButtonId() { return uploadButtonId; }
public void setUploadButtonId(String uploadButtonId) { this.uploadButtonId = uploadButtonId; }
public String getFileTypeExts() { return fileTypeExts; }
public void setFileTypeExts(String fileTypeExts) { this.fileTypeExts = fileTypeExts; }
public String getFileSizeLimit() { return fileSizeLimit; }
public void setFileSizeLimit(String fileSizeLimit) { this.fileSizeLimit = fileSizeLimit; }
public String getFileObjName() { return fileObjName; }
public void setFileObjName(String fileObjName) { this.fileObjName = fileObjName; }
public String getButtonClass() { return buttonClass; }
public void setButtonClass(String buttonClass) { this.buttonClass = buttonClass; }
public String getFileTypeDesc() { return fileTypeDesc; }
public void setFileTypeDesc(String fileTypeDesc) { this.fileTypeDesc = fileTypeDesc; }
public String getMethod() { return method; }
public void setMethod(String method) { this.method = method; }
public String getSwf() { return swf; }
public void setSwf(String swf) { this.swf = swf; }
public boolean isRemoveCompleted() { return removeCompleted; }
public void setRemoveCompleted(boolean removeCompleted) { this.removeCompleted = removeCompleted; }
public boolean isAuto() { return auto; }
public void setAuto(boolean auto) { this.auto = auto; }
public boolean isOverideUploadStart() { return overideUploadStart; }
public void setOverideUploadStart(boolean overideUploadStart) { this.overideUploadStart = overideUploadStart; }
public boolean isMulti() { return multi; }
public void setMulti(boolean multi) { this.multi = multi; }
public int getUploadLimit() { return uploadLimit; }
public void setUploadLimit(int uploadLimit) { this.uploadLimit = uploadLimit; }
public int getQueueSizeLimit() { return queueSizeLimit; }
public void setQueueSizeLimit(int queueSizeLimit) { this.queueSizeLimit = queueSizeLimit; }
public String getQueueHeight() { return queueHeight; }
public void setQueueHeight(String queueHeight) { this.queueHeight = queueHeight; }
public String getUploader() { return uploader; }
public void setUploader(String uploader) { this.uploader = uploader; }
public String getQueueID() { return queueID; }
public void setQueueID(String queueID) { this.queueID = queueID; }
public String getUploadStart() { return uploadStart; }
public void setUploadStart(String uploadStart) { this.uploadStart = uploadStart; }
public String getUploadSuccess() { return uploadSuccess; }
public void setUploadSuccess(String uploadSuccess) { this.uploadSuccess = uploadSuccess; }
public String getOnSelect() { return onSelect; }
public void setOnSelect(String onSelect) { this.onSelect = onSelect; }
public String getOnUploadComplete() { return onUploadComplete; }
public void setOnUploadComplete(String onUploadComplete) { this.onUploadComplete = onUploadComplete; }
public boolean isOnlyLibs() { return onlyLibs; }
public void setOnlyLibs(boolean onlyLibs) { this.onlyLibs = onlyLibs; } }
<tag>
<name>fileUpload</name>
<tagclass>com.util.tag.html.UploadifyTag</tagclass>
<bodycontent>empty</bodycontent>
<!-- 必填 -->
<attribute>
<name>basePath</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>formID</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>fileTypeExts</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>fileSizeLimit</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>fileObjName</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<!-- 可選 -->
<attribute>
<name>id</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>name</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploadButtonId</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>buttonClass</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>fileTypeDesc</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>method</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>swf</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>removeCompleted</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>auto</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>overideUploadStart</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>multi</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploadLimit</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>queueSizeLimit</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>queueHeight</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploader</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>queueID</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploadStart</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploadSuccess</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>onSelect</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>onUploadComplete</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>onlyLibs</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
</tag></pre>
fanlix 
碼頭工人 
xiefangjian