extjs文件上传

EXT学习教程：http://www.cnblogs.com/iamlilinfeng/category/385121.html

Ext文件上传：

例子用到的jar：

 
 1.upload.js

/*
case of upload
*/
Ext.onReady(function(){
//初始化标签中的Ext:Qtip属性。
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'side';
/*
var imageBox = new Ext.BoxComponent({
autoEl:{
//style: 'width:150px;height:150px;margin:0px auto;border:1px solid #ccc; text-align:center;padding-top:20px;margin-bottom:10px',
style:'width:150px;height:150px;border:1px solid #ccc;text-align:center',
tag:'div',
id:'showImage'
},
width:333,
height:277
});*/

var upload_form = new Ext.form.FormPanel({
title: '',
baseCls:'x-plain',
labelWidth:70,
labelHeight:150,
fileUpload:true,
defaultType : 'textfield',
items:[{
xtype:'textfield',
fieldLabel:'select file',
name:'userfile',
id:'userfile',
inputType:'file',
anchor:'95%'
}]
});

var win_upload = new Ext.Window({
title:'Upload :',
width:444,
height:140,
bodyStyle : 'padding:10px 10px 10px 10px;',
resizable:true,
modal:true,
closable:true,
maximizable:true,
minimizable:true,
buttonAlign:'right',
items:[upload_form],
buttons:[{
text:'reset',
handler:function(){
upload_form.getForm().reset();
}
},{
text:'upload',
handler:function(){
if(upload_form.getForm().isValid()){
if(Ext.getCmp('userfile').getValue() == ''){
Ext.Msg.alert('Warm :','please choose file!');
return;
}
/*
Ext.Msg.show({
title:'waiting:',
waitMsg:'uploading...',
progressText:'',
width:300,
progress : true,
closable : false,
animEl : 'loding'
});*/
upload_form.getForm().submit({
method:'POST',
url:'uploadServlet',
waitMsg:'uploading...',
success:function(upload_form,action){
//var path = Ext.getCmp('userfile').getValue();
//document.getElementById('showImage').innerHTML = '<img src="'+path+'" />';
Ext.Msg.alert('success:','upload success!');
//win_upload.hide();
},
failure:function(upload_form,action){
Ext.Msg.alert('failure:','upload failure!');
}
});
}
}
}]
});
win_upload.show();
});

 2.uploadServlet.java

package servlet;

import java.io.File;
import java.io.IOException;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.FileItemFactory;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.json.JSONObject;

/**
* Servlet implementation class uploadServlet
*/
public class uploadServlet extends HttpServlet {
private static final long serialVersionUID = 1L;

/**
* @see HttpServlet#HttpServlet()
*/
public uploadServlet() {
super();
// TODO Auto-generated constructor stub
}

/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
}

/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
response.setContentType("text/html");
response.setCharacterEncoding("UTF-8");
try {
FileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload fileUpload = new ServletFileUpload(factory);
fileUpload.setHeaderEncoding("UTF-8");// 解决中文名乱码
List<FileItem> fileItems = fileUpload.parseRequest(request);
for(FileItem item:fileItems){//忽略其他表单信息
if (!item.isFormField()) {
String name = "";
String BrowserType = request.getHeader("User-Agent").toLowerCase().toString();
//浏览器判断
if (BrowserType.indexOf("firefox")>0 ||BrowserType.indexOf("chrome")>0) {
name = item.getName();
}else{
name = item.getName();
String [] names =  name.split("\\\\");//  (IE浏览器绝对路径，split获取文件名及后缀) regex为\\\\，因为在java中\\表示一个\，而regex中\\也表示\，所以当\\\\解析成regex的时候为\\。
name = names[names.length-1];
}
File uploadFile = new File("E:\\",name);
item.write(uploadFile);
}
}
//
JSONObject obj = new JSONObject();
obj.put("success","true");
response.getWriter().print(obj.toString());

} catch (Exception e) {
e.printStackTrace();
// TODO: handle exception
}

}

}