ext 上传文件 版本 3.x 上传图片和上传视频都可以

其他 2019-05-06 11:00:53 阅读次数: 0

jsp中，引用ext的基础js，别忘了FileUploadField.js

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/page/system/include.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="cache-control" content="no-cache,no-store">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="<%= request.getContextPath()%>/ext/resources/css/FileUploadField.css">
<link rel="stylesheet" type="text/css" href="<%= request.getContextPath()%>/ext/resources/css/ext-all.css" />
<meta http-equiv="Expires" content="0">
<script type="text/javascript" src="<%= request.getContextPath()%>/ext/ext-base.js"></script>
<script type="text/javascript" src="<%= request.getContextPath()%>/ext/ext-all.js"></script>
<script type="text/javascript" src="<%= request.getContextPath()%>/ext/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="<%= request.getContextPath()%>/ext/examples.js"></script>
<script type="text/javascript"
	src="<%= request.getContextPath()%>/ui/common/common.js"></script>
<script type="text/javascript"
	src="<%= request.getContextPath()%>/ext/ux/RowExpander.js"></script>

<script type="text/javascript" src="<%= request.getContextPath()%>/dwr/interface/HandleOfBatch.js"></script>
<script type="text/javascript" src="<%= request.getContextPath()%>/ui/common/FileUploadField.js"></script>
<script type="text/javascript"
	src="<%= request.getContextPath()%>/ui/work/T130200.js"></script>

</head>
<body>
	<!-- 操作员查询 -->
</body>
</html>

 js

// 菜单集合
	var menuArr = new Array();
	var addPig = {
			text: '上传图片',
			width: 85,
			disabled: false,
			iconCls: 'edit',
			handler:function() {
//				var	selectedRecord = grid.getSelectionModel().getSelected();
//	            if(selectedRecord == null)
//	            {
//	                showAlertMsg("没有选择记录",grid);
//	                return;
//	            }
				brhWinAll.show();
				brhWinAll.center();
			}
		};
var brhInfoFormAll = new Ext.form.FormPanel({
		frame: true,
		autoHeight: true,
		width: 400,
		defaultType: 'textfield',
		labelWidth: 90,
		waitMsgTarget: true,
		fileUpload: true,
		enctype:'multipart/form-data',
		items: [{
    		xtype: 'dynamicCombo',
	        methodName: 'getRailWorkInfolList',
			labelStyle: 'padding-left: 5px',
			fieldLabel: '作业工单*',
			hiddenName: 'workCode',
			allowBlank: false,
			editable: false,
			width:300,
			emptyText: "--请选择工单--"
    	},{
			xtype: 'fileuploadfield',
			fieldLabel: '图片',
			buttonText:'浏览',
			width:'220',
			style: 'padding-left: 5px',
			id: 'upload',   
		    name: 'upload'
		}]
	});
	var brhWinAll = new Ext.Window({
		title: '工单上传图片',
		initHidden: true,
		header: true,
		frame: true,
		closable: false,
		modal: true,
		width: 450,
		autoHeight: true,
		layout: 'fit',
		items: [brhInfoFormAll],
		buttonAlign: 'center',
		closeAction: 'hide',
		iconCls: 'logo',
		resizable: false,
		buttons: [{
			id : 'ensure1',
			text: '确定',
			handler: function() {
				var	selectedRecord = grid.getSelectionModel().getSelected();
				if(brhInfoFormAll.getForm().isValid()) {
					//var submitValues = brhInfoFormAll.getForm().getValues();  
					brhInfoFormAll.getForm().submit({
						url: 'T130200Action_upload.asp',
						waitMsg: '正在提交，请稍后......',
						success: function(form,action) {
						},
						failure: function(form,action) {
							if(action.result.code ==200){
								brhWinAll.hide();
								showSuccessMsg(action.result.msg,brhInfoFormAll);
								brhInfoFormAll.getForm().reset();
								grid.getStore().reload();
							}else{
								showErrorMsg(action.result.msg,brhInfoFormAll);
							}
						},
						params: {
							txnId: '1302',
							subTxnId: '01'
						}
					});
				}
			}
		},{
			id : 'reset1',
			text: '重置',
			handler: function() {
				brhInfoFormAll.getForm().reset();
			}
		},{
			text: '关闭',
			handler: function() {
				brhWinAll.hide(grid);
				brhInfoFormAll.getForm().reset();
			}
		}]
	});

java后端，这个项目用的strus2  其他的springmvc都差不多。

 action:

//syl工单图片上传
	private Map result;
	
	private List<File> upload; 
    // 上传文件名  
    private String[] uploadFileName; 
    // 上传文件的MIME类型  
    private String[] uploadContentType;  
	

public String upload() throws Exception {
		
		operator = (Operator) getSessionAttribute(Constants.OPERATOR_INFO);//获取项目操作者
		
		log.info("上传图片开始");
		String imgPath = "";//上传后的服务器图片地址
		String format = sdf.format(new Date());
    	String suffix = null;
        String fileName = null;
        String fileName2 = null;
		if(null!=upload){
			for (int i = 0; i < upload.size(); i++) {
				File myfile=upload.get(i);
				String myfileName=uploadFileName[i];
				String myfileType=uploadContentType[i];
				if(myfile.exists()){
					log.info("--> File Length: " + myfile.length());
	                log.info("--> File Tyep: " + myfileType);
	                log.info("--> File Name: " + myfile.getName());
	                log.info("--> File Original: " + myfileName);
	                log.info("========================================");
					String realPath = ServletActionContext.getServletContext().getRealPath("/upload/" + format);
	                log.info("--> " + realPath);
	                File dir = new File(realPath);
	                if (dir.exists()) {
	                	System.out.println("file exists");
	                } else {
	                	System.out.println("file not exists, create it ...");
	                	try {
	                        dir.mkdirs();
	                    } catch (Exception e) {
	                        e.printStackTrace();
	                    }    
	                } 
	                FileInputStream inputStream=new FileInputStream(myfile);
	                int lastIndexOf = myfileName.lastIndexOf(".");
	                suffix = myfileName.substring(lastIndexOf + 1, myfileName.length());
	                fileName2 = UUID.randomUUID().toString().replaceAll("-", "");
	                fileName = fileName2 + "." + suffix;
	                log.info("--> File Suffix Name: " + fileName + "---- old Name: " + myfileName);
	                File file = new File(realPath, fileName);
	                FileOutputStream fos = new FileOutputStream(file);
	                int buffer = 1024; //定义缓冲区的大小
	                int length = 0;
	                byte[] b = new byte[buffer];
	                while ((length = inputStream.read(b)) != -1) {
	                    fos.write(b, 0, length); //向文件输出流写读取的数
	                }
	                fos.close();
	                
	                imgPath = "/upload/"+format +"/"+ fileName;
	                b = null;
	                file = null;
	                inputStream = null;
	                fos = null;
				}
			}
			
			log.info("上传图片成功");
		}
		Date date = new Date();
		log.info("------------------新增工图片---------------");
		RailWorkImg railWorkImg = new RailWorkImg();
		railWorkImg.setImgPath(imgPath);
		railWorkImg.setWorkCode(workCode);
		railWorkImg.setImgType(String.valueOf(ImgTypeEnums.PIG.getCode()));
		railWorkImg.setAddDate(new Date());
		railWorkImg.setAddUser(operator.getOprId());
		railWorkImg.setDelStatus(String.valueOf(DelStatusEnums.NO.getCode()));
		
        String uuid = UUID.randomUUID().toString().replaceAll("-", "");
        if(imgPath!=""){
        	//railToolInfo.setToolImg(imgPath);
        }else{
        	log.info("图片未上传");
        }
		log("添加工单图片成功。操作员编号：" + operator.getOprId());
		t130200BO.add(railWorkImg);
		result =  ResultUtils.success(1);
		return SUCCESS;
	}

strus.xml

<!--  工单图片上传 -->
		<action name="T130200Action_upload" class="com.rail.struts.work.action.T130200Action" method="upload">
			<result name='success' type='json'>
					<param name="root">result</param>
				</result>
		</action>
		<action name="T130200Action_uploadVedio" class="com.rail.struts.work.action.T130200Action" method="uploadVedio">
			<result name='success' type='json'>
					<param name="root">result</param>
				</result>
		</action>

控制台打印

控制台打印：2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] 上传图片开始
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] --> File Length: 1043130
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] --> File Tyep: image/jpeg
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] --> File Name: upload__123eea71_16a808e1b07__8000_00000009.tmp
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] --> File Original: 4.jpg
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] ========================================
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] --> E:\myeclipse_dev\.metadata\.me_tcat85\webapps\JSBConsole\upload\20190504
file not exists, create it ...
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] --> File Suffix Name: 6ff7559e34104723a28865263359df34.jpg---- old Name: 4.jpg
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] 上传图片成功
2019-05-04 10:08:26 [com.rail.struts.work.action.T130200Action]-[INFO] ------------------新增工图片---------------
2019-05-04 10:08:26 [com.huateng.struts.system.action.BaseAction]-[INFO] 添加工单图片成功。操作员编号：admin 

Hibernate: insert into CONSONLINE.RAIL_WORK_IMG (WORK_CODE, IMG_TYPE, IMG_PATH, DEL_STATUS, ADD_USER, ADD_DATE, UPD_USER, UPD_DATE, NOTE1, NOTE2, NOTE3, ID) values (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
Hibernate: SELECT SEQ_TERM_NO.NEXTVAL FROM DUAL

猜你喜欢

转载自blog.csdn.net/somdip/article/details/89810832
今日推荐
NetBSD 禁止提交由 AI 生成的代码
Apache Doris 2.0.10 版本正式发布！
开源日报 | 大模型开战；大模型独角兽被曝卖身；周鸿祎建议谷歌开源所有产品；最大开源AI社区提供1000万美元共享GPU
开源日报 | Chrome内置Gemini的意义不在于Gemini；中国AI追随之路的五大误区；ECharts创始人“下海”养鱼；谷歌I/O开发者大会什么都有，只是没有惊喜
微软回应中国区AI团队“打包赴美”传闻
基于大语言模型的开源知识库问答系统 MaxKB GitHub Star 数量突破 5,000 个！
周排行
static方法和非static方法的区别（java）
如何查找计算机专业paper
java.lang.ClassFormatError: Incompatible magic value 0 in class file com/sitecha
跳跃游戏II
stm32_之【建立工程】
TeaWeb v0.0.9 发布，统计底层优化、主机监控功能改进
事件分发 -----控制字体大小
JavaScript DOM练习（动态表格添加） December 25，2019
JSF Scope & CDI
实现从零搭建一个登录注册页面（附源代码）
每日归档
更多
2024-05-19(0)
2024-05-18(4)
2024-05-17(34)
2024-05-16(6)
2024-05-15(24)
2024-05-14(0)
2024-05-13(18)
2024-05-12(0)
2024-05-11(38)
2024-05-10(38)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022