您的位置:首页 > 其它

文件上传字段Ext.form.field.File(扩展Text)

2016-02-02 00:00 686 查看
摘要: 文件上传字段Ext.form.field.File(扩展Text)



<div id="uploadForm" class="w_320">
<h2>文件上传字段</h2>
</div>

Ext.onReady(function(){
//Ext表单

//Ext.form.Basic 基本表单组件二(拾取器字段Picker)
//开发中使用表单面板组件Ext.form.Panel,它本质是一个标准的(面板)Ext.panel.Panel,它内置并自动创建了Ext.form.Basic基本表单组件
//与原始表单主要3点不同(1.提交方式 2.表单验证 3.表单组件)
//1.提交方式(同步---异步)
//2.表单验证(需要手动验证----配置即可使用)
//3.表单组件(基本的组件------扩展的功能强大的组件)

//Picker抽象类,具有唯一的触发按钮用于在字段下方动态弹出面板
//拾取器组件如:(1.ComboBox,2.Date,3.Time)

//初始化信息提示功能
Ext.QuickTips.init();

//文件上传字段Ext.form.field.File(扩展Text)
var uploadForm = Ext.create("Ext.form.Panel",{
title : 'Ext.form.field.File示例',
width : 300,
height : 100,
renderTo : 'uploadForm',
farme : true,
bodyStyle : 'padding:5px',
defaults : {//统一设置字段属性
width : 150,
labelWidth : 50,
labelSeparator : ': ',
labelAlign : 'left',
allowBlank : false,//不允许为空
msgTarget : 'side'//在字段的右边显示提示信息
},
items : [{
name : 'myPhoto',
fieldLabel : '照片',
xtype : 'filefield',
anchor : '100%',
buttonText : '选择照片...'
}],
buttons : [{
text : '上传文件',
handler : uploadMyFile
}]

});

//上传文件回调函数
function uploadMyFile(){
var form = uploadForm.getForm();
if(form.isValid()){
form.submit({
url : '../upload.jsp',
waitMsg : '正在上传照片文件请稍后...',
success : function(fp,o){
console.info(o);
if(o.result.success){
Ext.Msg.alert('提示信息','你的照片文件"'+o.result.file+'"已经上传成功');
}else {
Ext.Msg.alert('上传失败!');
}
}
});
}
}

});

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page import="org.apache.commons.fileupload.*" %>
<%@ page import="org.apache.commons.fileupload.FileItem" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<%
DiskFileUpload upload = new DiskFileUpload();
upload.setHeaderEncoding("utf8");
List items = upload.parseRequest(request);
ListIterator listIterator = items.listIterator();
String fileName = "";
while(listIterator.hasNext()){
FileItem item = (FileItem)listIterator.next();
if(!item.isFormField()){
fileName = item.getName();
fileName = fileName.substring(fileName.lastIndexOf("\\")+1);
}
}
String msg = "{success:true,file:'"+fileName+"'}";
response.getWriter().write(msg);
%>

1.HTML文件 2.JS文件 3. JSP文件
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息