ExtJS:文件上传实例

  1. var ext_dateFormat = 'Y-m-d H:i:s';
  2. var dateFormat = 'yyyy-MM-dd HH:mm:ss';
  3. var date = new Date();
  4. Ext.onReady(function() {
  5. var fifp =Ext.create('Ext.form.Panel', {
  6. renderTo: 'fi-form',
  7. width: 500,
  8. frame: true,
  9. title: '文件上传',
  10. bodyPadding: '10 10 0',
  11.  
  12. defaults: {
  13. anchor: '100%',
  14. allowBlank: false,
  15. msgTarget: 'side',
  16. labelWidth: 80
  17. },
  18. items: [{
  19. xtype: 'textfield',
  20. fieldLabel: '样品编号',
  21. id:'finfo',
  22. name:'finfo'
  23. },{
  24. xtype: 'container',
  25. layout: 'hbox',
  26. items: [{
  27. xtype: 'textfield',
  28. fieldLabel: '当前经度',
  29. id:'flongitude',
  30. name:'flongitude',
  31. msgTarget: 'side',
  32. allowBlank: false,
  33. labelWidth: 80
  34. }, {
  35. xtype: 'textfield',
  36. fieldLabel: '当前纬度',
  37. id:'flatitude',
  38. name:'flatitude',
  39. msgTarget: 'side',
  40. allowBlank: false,
  41. labelWidth: 80
  42. }]
  43. },{
  44. xtype : 'textfield',
  45. fieldLabel : '上传时间',
  46. id : 'ftime',
  47. name : 'ftime',
  48. // yyyy-MM-dd HH:mm:ss
  49. value : Ext.Date.format(new Date(date.getFullYear(),date.getMonth(),date.getDate(),
  50. date.getHours(),date.getMinutes(),date.getSeconds()), ext_dateFormat),
  51. listeners : {
  52. 'focus' : function() {
  53. WdatePicker({
  54. dateFmt : dateFormat
  55. });
  56. }
  57. }
  58. },{
  59. xtype: 'filefield',
  60. id: 'fiupload',
  61. emptyText: '请点击右边按钮选择文件!',
  62. fieldLabel: '选择文件',
  63. name: 'fiupload',
  64. buttonText: '浏览文件',
  65. buttonConfig: {
  66. iconCls: 'upload-icon'
  67. }
  68. }],
  69.  
  70. buttons: [{
  71. text: '保存文件',
  72. handler: function(){
  73. var fiform = this.up('form').getForm();
  74. if(fiform.isValid()){
  75. fiform.submit({
  76. type : 'ajax',
  77. url: 'files/addData.action',
  78. method : "POST",
  79. waitMsg: ' 正在上传,请稍候...',
  80. success: function(form, action) {
  81. Ext.Msg.alert('Success','文件上传成功!');
  82. },
  83. failure:function(form, action)
  84. {
  85. Ext.Msg.alert("Failure","文件上传失败");
  86. }
  87. });
  88. }
  89. }
  90. },{
  91. text: '重新上传',
  92. handler: function() {
  93. this.up('form').getForm().reset();
  94. }
  95. }]
  96. });
  97.  
  98. });

后台处理核心类方法:

  1. private static final int BUFFER_SIZE = 16 * 1024;
  2.  
  3. public String addData() throws Exception {
  4. Timestamp ts = new Timestamp(System.currentTimeMillis());
  5. SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmssSSS");// 设置日期格式
  6. ts = Timestamp.valueOf(this.ftime);
  7. System.out.println(ts);
  8. String nowtime = df.format(new Date());
  9. System.out.println("uploadFileName = " + this.fiuploadFileName);
  10. System.out.println("uploadContentType = " + this.fiuploadContentType);
  11. System.out.println(nowtime);
  12. // upload -- wapps 下面的文件夹,用来存放图片
  13. String toSrc = ServletActionContext.getServletContext().getRealPath(
  14. "upload")
  15. + "/" + nowtime + getFileExp(this.fiuploadFileName); // 使用時間戳作為文件名
  16. String toFilename = nowtime + getFileExp(this.fiuploadFileName);
  17. String toSrcPath = "./upload/" + toFilename;
  18. String toinfo = this.finfo;
  19. Double tolongitude = Double.parseDouble(this.flongitude);
  20. Double tolatitude = Double.parseDouble(this.flatitude);
  21. System.out.println("原文件名 : " + this.fiuploadFileName);
  22. System.out.println("文件描述 : " + toinfo);
  23. System.out.println("存放路径: " + toSrcPath);
  24. System.out.println("存放文件名: " + toFilename);
  25. System.out.println("当前经度 : " + tolongitude);
  26. System.out.println("当前维度 : " + tolatitude);
  27. File toFile = new File(toSrc);
  28. writeFile(this.fiupload, toFile);
  29. Files files = new Files(ts, toFilename, toSrcPath, toinfo, tolatitude,
  30. tolongitude);
  31. String result = filesService.addData(files);
  32. System.out.println(result);
  33. success = true;
  34. return SUCCESS;
  35. }
  36.  
  37. private static void writeFile(File src, File dst) {
  38. System.out.println(" == 文件写入 == ");
  39. try {
  40. InputStream in = null;
  41. OutputStream out = null;
  42. try {
  43.  
  44. in = new BufferedInputStream(new FileInputStream(src),
  45. BUFFER_SIZE);
  46. out = new BufferedOutputStream(new FileOutputStream(dst),
  47. BUFFER_SIZE);
  48. byte[] buffer = new byte[BUFFER_SIZE];
  49. while (in.read(buffer) > 0) {
  50. out.write(buffer);
  51. }
  52. } finally {
  53. if (null != in) {
  54. in.close();
  55. }
  56. if (null != out) {
  57. out.close();
  58. }
  59. }
  60. } catch (Exception e) {
  61.  
  62. e.printStackTrace();
  63. }
  64. System.out.println(" == 写入成功! == ");
  65. }

ExtJS:文件上传实例的更多相关文章

  1. PHP中,文件上传实例

    PHP中,文件上传一般是通过move_uploaded_file()来实现的.  bool move_uploaded_file ( string filename, string destinati ...

  2. PHP学习笔记--文件目录操作(文件上传实例)

    文件操作是每个语言必须有的,不仅仅局限于PHP,这里我们就仅用PHP进行讲解 php的文件高级操作和文件上传实例我放在文章的最后部分.--以后我还会给大家写一个PHP类似于网盘操作的例子 注意:阅读此 ...

  3. PHP+ExtJS 文件上传示例

    xtJS 4 有一个非常方便的文件上传组件,可以用来将文件上传到服务器.本文PHP教程UncleToo将介绍使用PHP和ExtJS实现文件上传功能. 首先,创建文件上传组件Ext.form.Panel ...

  4. Grails笔记三:完整的文件上传实例

    文件上传在web应用中是比较普遍的,相对于使用jsp等技术实现文件上传,Grails的文件上传着实让人喜爱,因为极其简单,让人看一遍就容易轻松记住!不多说,实例如下: 假设已有一个名为uploadFi ...

  5. Extjs文件上传问题总结

    本来文件上传是一个简单而常用的功能,但是,由于刚刚接触extjs,对extjs中的控件及其使用方法并不熟悉,导致本来一个很快就可以搞定的文件上传问题,弄了将近两天的时间.现将问题及解决办法发出来,供有 ...

  6. 自定义ExtJS文件上传

    日常工作中,一般文件上传都是跟随表单一起提交的,但是遇到form表单中有许多地方有文件上传时这种方式却不是很适用,以下是我工作中用的文件上传方式: { xtype: 'fileuploadfield' ...

  7. struts2+extjs文件上传完整实现(攻克了上传中的各种问题)

    版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/shanhuhau/article/details/28617999 首先须要引入上传控件 <s ...

  8. SpringMVC+ajax文件上传实例教程

    原文地址:https://blog.csdn.net/weixin_41092717/article/details/81080152 文件上传文件上传是项目开发中最常见的功能.为了能上传文件,必须将 ...

  9. ASP.NET多文件上传实例

    在Web应用程序开发中,避免不了要用到上传文件这个功能,但以前上传文件是个很麻烦的事,现在有了.NET,文件上传变得轻而易举.下面的这个例子实现了多文件上传功能.可以动态添加输入表单,上传的文件数量没 ...

随机推荐

  1. activiti监听器使用

    分享牛原创(尊重原创 转载对的时候第一行请注明,转载出处来自分享牛http://blog.csdn.net/qq_30739519) activiti使用的时候,通常需要跟业务紧密的结合在一起,有些业 ...

  2. EJB通过注解方式注入并使用其他EJB或者服务、配置JBoss数据源

    通过注解方式注入并使用其他EJB或者服务 真实项目EJB对象很多,EJB之间也可以互相调用, 在项目HelloWorld下新建接口Other在cn.hqu.ejb3下: public interfac ...

  3. 如何使用分布是缓存Hazelcast

    使用Hazelcast 1.在pom.xml中配置对Hazelcast的依赖 <dependencies> <dependency> <groupId>com.ha ...

  4. [ExtJS5学习笔记]第十九节 Extjs5中通过设置form.Panel的FieldSet集合属性控制多个field集合

    本文地址:http://blog.csdn.net/sushengmiyan/article/details/39209533 官方例子:http://docs.sencha.com/extjs/5. ...

  5. Android摄像头照相机技术-android学习之旅(八)

    简介 Android SDK支持Android设备内置的照相机.从Android2.3开始支持多个摄像头(主要指前置摄像头和后置摄像头).通过照片相可以拍照和录像. 需要考虑的问题 是否支持照相机 快 ...

  6. 02_MyBatis项目结构,所需jar包,ehcache.xml配置,log4j.properties,sqlMapConfig.xml配置,SqlMapGenerator.xml配置

     项目结构(所需jar包,配置文件) sqlMapConfig.xml的配置内容如下: <?xmlversion="1.0"encoding="UTF-8&qu ...

  7. Android 5.1.1 源码目录结构

    点击打开链接 最近公司培训新同事,我负责整理一点关于android的基础知识,遥想当年,刚接触android,也是一头雾水, 啥都不懂,就是靠看文档和视频,对android有一个初步了解,然后就通过查 ...

  8. (NO.00005)iOS实现炸弹人游戏(二):素材选择的取舍

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请告诉我,如果觉得不错请多多支持点赞.谢谢! hopy ;) 前面一篇里我们基本明确了游戏的大致玩法和特点.下面就游戏中会用到 ...

  9. 【一天一道LeetCode】#217. Contains Duplicate

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Given a ...

  10. boost::coroutine 无法显示调用栈

    boost::coroutine 无法显示调用栈(金庆的专栏)一例因 boost::format() 格式化参数个数错误造成的 coredump,因为使用了 boost::coroutine, 无法显 ...