ExtJS 上传照片

ExtJS 前台代码:

var imgPanel = new Ext.Panel({
    id:'id-form-picture-upload',
	layout: 'form',
	items: [
	{
		xtype:'label',
		fieldLabel: '照片',
		height: 110,
		maxWidth: 120, 
		html:'<div><img id="img-id" height="110px" src="./picture/default.jpg" /></div>'
	},
	{
		xtype     : 'fileuploadfield', 
		buttonText: '选择照片', 
		id        : 'imagePath',
		fieldLabel: '上传照片 ',
		name      : 'imagePath',
		anchor    : '85%',
		listeners : {
			'fileselected': function(fb, v){
				var imagePathCmp = Ext.get('imagePath');
				var picturePath = imagePathCmp.getValue();
				//上传的后缀名
				var idx = picturePath.lastIndexOf(".");   
				if (idx != -1){   
					var ext = picturePath.substr(idx+1).toUpperCase();   
					ext = ext.toLowerCase( ); 
					//判断是不是一般的图片类型
					if (ext != 'jpg' && ext != 'gif'&& ext !='bmp'){
						Ext.Msg.alert('提示', '请上传正确的图片类型(.jpg,.gif,.bmp,.png)!');
						Ext.getCmp('imagePath').setValue(null);
						//把图片显示设为默认的
						document.getElementById("img-id").src = "./picture/default.jpg";
						return;  
					} 
				}		
				//上传
				Ext.getCmp('id-panel-add-police').getForm().submit({
					url   : 'police/uploadPicture',
					method: 'post',
					clientValidation : false,
					scope: this,
					success: function(form, action) {
						Ext.Msg.alert('提示', action.result.msg);
						document.getElementById("img-id").src = action.result.imageReturePath;
		                Ext.getCmp('imagePath').setValue(action.result.imageReturePath);
					},
					failure: function(form, action) {
						Ext.Msg.alert('提示', '上传失败!');
					}
				});
			}
		}
	}]
});


JAVA 后台代码:

package com.sip.action;

import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.io.InputStream;

import org.apache.commons.io.IOUtils;
import org.apache.struts2.ServletActionContext;

import com.opensymphony.xwork2.ActionSupport;
/**
 * 照片上传
 */
public class UploadPictureAction extends ActionSupport{
	
	//图片文件
	private File[] imagePath;
	
	//文件名称
	private String[] imagePathFileName;
	
	//返回给客户端的路径
	private String imageReturePath;
	
	//操作成功标志
	private boolean success;
	
	//操作返回信息
	private String msg;

	//相对路径
	public final static String PICTUREDIR = "picture\\temp\\";
	
	public boolean isSuccess() {
		return success;
	}

	public String getMsg() {
		return msg;
	}

	public String getImageReturePath() {
		return imageReturePath;
	}

	public void setImagePath(File[] imagePath) {
		this.imagePath = imagePath;
	}

	public void setImagePathContentType(String[] imagePathContentType) {
	}

	public void setImagePathFileName(String[] imagePathFileName) {
		this.imagePathFileName = imagePathFileName;
	}

	/**
	 * 
	 * 上传照片
	 */
    public String execute() throws Exception {
    	
    	InputStream in = null ;
    	
    	FileOutputStream out = null;
    	
    	try{
    		//照片对应的工程绝对路径
    		String pictureAbsoluteProjectDir = ServletActionContext.getServletContext().getRealPath("/")+PICTUREDIR;
    	   
    		//生成一个随机名称
    	    String randName = System.currentTimeMillis() + "";
    	    
    	    //照片名称
    	    String pictureName = randName+imagePathFileName[0].substring(imagePathFileName[0].lastIndexOf("."));
    	    
    	    //文件流传输
    	    in = new FileInputStream(imagePath[0]);
    	    
    	    File fileDir = new File(pictureAbsoluteProjectDir);
    	    
			//创建目录
    	    if(!fileDir.exists()) {
			   fileDir.mkdirs();
		    }
    	    String pictureProjectPath = pictureAbsoluteProjectDir+pictureName;

    	    //在存放目录下新建文件对象
    	    File file = new File(pictureProjectPath);

    	    //创建文件
    	    file.createNewFile();

    	    //创建文件的输出流
    	    out = new FileOutputStream(file);

    	    //复制
    	    IOUtils.copy(in, out);

    		out.flush();
    		imageReturePath = PICTUREDIR+pictureName;

    		success = true; 
    		msg = "上传成功!";

    	}catch(Exception e){

    		success = false;    		
    		msg = "图片传输错误!";
    	}finally{

    		out.close();
    		in.close();
    	}
    	return SUCCESS;
    }       
}

struts.xml的配置:

<!-- 上传照片 -->
<action name="uploadPicture" class="com.sip.UploadPictureAction">
	<result type="json">				
		<param name="contentType">text/html;charset=utf-8</param> 
	</result>
</action>



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值