ext的官方網站有許多大俠寫了許多狠牛的上傳控件，但是功能太炫，我感覺反而不適用！效果如下 
上傳完了之後地址會加載到上傳內容這個文本框裏面 
裏面還做了類型判斷，用於上傳文本和相片代碼如下，把一下代碼封裝在一個js文件裏面
//*****************************************上傳的公共js***************************************************************//
/**
* 約定:types爲調用時傳來的參數.形式爲jsp-gig-png
* uploadid爲上傳後要填充路徑的控件id
* 上傳的屬性均爲upload
* 功能:頁面調用openUpload("","");方法即可
*/
//...允許上傳的後綴名
var types = "";
//...上傳後填充控件的id
var uploadid = "";
function openUpload(type,id){
types = type;
uploadid = id;
winUpload.show();
}
var formUpload = new Ext.form.FormPanel({
baseCls: 'x-plain',
labelWidth: 80,
fileUpload:true,
defaultType: 'textfield',
items: [{
xtype: 'textfield',
fieldLabel: '文 件',
name: 'upload',
inputType: 'file',
allowBlank: false,
blankText: '請上傳文件',
anchor: '90%' // anchor width by percentage
}]
});
var winUpload = new Ext.Window({
title: '資源上傳',
width: 400,
height:200,
minWidth: 300,
minHeight: 100,
layout: 'fit',
plain:true,
bodyStyle:'padding:5px;',
buttonAlign:'center',
items: formUpload,
buttons: [{
text: '上 傳',
handler: function() {
if(formUpload.form.isValid()){
Ext.MessageBox.show({
title: 'Please wait',
msg: 'Uploading...',
progressText: '',
width:300,
progress:true,
closable:false,
animEl: 'loding'
});
formUpload.getForm().submit({
url:'uploadAction.action?types='+types,
success: function(form, action){
var objxzdz = Ext.get(uploadid).dom;
var value = action.result.msg;
objxzdz.value = value;
Ext.Msg.alert('成功','上傳成功.');
winUpload.hide();
},
failure: function(form, action){
//... action生成的json{msg:上傳失敗},頁面就可以用action.result.msg得到非常之靈活
Ext.Msg.alert('Error', action.result.msg);
}
})
}
}
},{
text: '取 消',
handler:function(){winUpload.hide();}
}]
});
//*****************************************上傳的公共js***************************************************************//
現在已經封裝完畢了，我們看看在頁面上如何調用
openUpload("txt-xls-doc-docs-pds","xzdzid");
就這一句話，嘿嘿，簡單吧？第一個參數爲允許上傳的類型，第二個參數爲上傳後地址要綁定到哪個控件（是該控件的id）
action的代碼還是貼下吧
import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import org.apache.struts2.ServletActionContext;
import net.ask123.ecommerce.common.util.Common;
import net.ask123.ecommerce.common.util.Constants;
import net.ask123.ecommerce.common.util.FileOperate;
import net.ask123.ecommerce.common.util.VeDate;
/**
* 上傳的公共方法
*
* @author sam.zhang
*
*/
public class UploadAction extends ExtJsonActionSuport {
/**
*
*/
private static final long serialVersionUID = 1L;
//和前臺的名字一樣，這裏約定是 upload
private File upload;
private String uploadContentType;
private String uploadFileName;
private String savePath;
// 存放允許上傳的後綴名
private String types;
public String getSavePath() {
return savePath;
}
public void setSavePath(String savePath) {
this.savePath = savePath;
}
public File getUpload() {
return upload;
}
public void setUpload(File upload) {
this.upload = upload;
}
public String getUploadContentType() {
return uploadContentType;
}
public void setUploadContentType(String uploadContentType) {
this.uploadContentType = uploadContentType;
}
public String getUploadFileName() {
return uploadFileName;
}
public void setUploadFileName(String uploadFileName) {
this.uploadFileName = uploadFileName;
}
public String getTypes() {
return types;
}
public void setTypes(String types) {
this.types = types;
}
@SuppressWarnings("deprecation")
public String execute() throws Exception {
String msg = "";
FileOperate fo = new FileOperate();
String sid = VeDate.getNo(4);
this.savePath = "/updownFiles";
try {
// ...獲取文件後綴名
String ext = fo.getFileExt(getUploadFileName());
if ("".equals(this.types)
|| Common.indexofString(this.types, "-") == -1) {
msg = "上傳失敗";
this.setJsonString("{success:false,msg:'" + msg + "'}");
return SUCCESS;
}
// ...判斷上傳的文件是否合法
boolean istrue = FileOperate.trueExt(this.types.split("-"), ext);
if (!istrue) {
msg = "您上傳的文件格式不正確，正確格式爲" + this.types;
this.setJsonString("{success:false,msg:'" + msg + "'}");
return SUCCESS;
}
// ...文件存放的位置
String sPath = ServletActionContext.getRequest().getRealPath(
this.getSavePath())
+ Constants.FILESPARA
+ sid.substring(0, 4)
+ Constants.FILESPARA
+ sid.substring(4, 6)
+ Constants.FILESPARA;
// ...保存在數據庫的路徑
String filePath = this.savePath + "/" + sid.substring(0, 4) + "/"
+ sid.substring(4, 6) + "/" + sid + "." + ext;
// 如果目錄不存在則創建它
fo.createFolder(sPath);
FileOutputStream fileOutputStream = new FileOutputStream(sPath
+ sid + "." + ext);
FileInputStream fileInputStream = new FileInputStream(getUpload());
// ...
byte[] buffer = new byte[1024];
int len = 0;
while ((len = fileInputStream.read(buffer)) > 0) {
fileOutputStream.write(buffer, 0, len);
}
this.setJsonString("{success:true,msg:'" + filePath + "'}");
} catch (Exception e) {
this.setJsonString("{success:false}");
e.printStackTrace();
}
return SUCCESS;
}
}
關鍵是
url:'uploadAction.action?types='+types,這裏會指定後臺的請求地址