浅谈struts1 & jquery form 文件异步上传


Posted in jQuery onMay 25, 2017

1.概述

还在用struts1?是的,在地球的没写地方,落后的生产方式还在运转(老项目).

从 继承org.apache.struts.action.Action, 继承org.apache.struts.action.ActionForm开始吧

2. 代码

2.1 html页面

<html>
<head>
<title>网页上传</title>
</head>
<body>
  <center>
    <h1>本地文件网页上传</h1>
    <hr>

  </center>

  <h1>文件信息列表</h1>
  <hr>
  <form id="myform" method="post" enctype="multipart/form-data">
    <table width="0" border="0" cellspacing="10" cellpadding="0">
    
      <tr>
        <td>选择文件:</td>
        <td><input type="file" name="uploadFile" /></td>
      </tr>
      <tr>
        <td>标题:</td>
        <td><input type="text" name="filetitle" /></td>
      </tr>

      <tr>
        <td colspan="2">
          <input type="button" id="mysubmit" value="确认上传"/>
        </td>
      </tr>

    </table>
  </form>
  <script src="script/jquery.js"></script>
  <script src="script/jquery.form.js"></script>
  <script src="script/_fileUpload.js"></script>
</body>
</html>

2.2 _fileUpload.js

/**
 *_fileUpload.js 
 *
 * 
 */
window.onload = function() {
  
  
  $("#mysubmit").bind("click", function(){
    $("#myform").ajaxSubmit({
      url: "myUpload.do",
      type: "post",
      success: function(data){
        console.log(11111111);
        console.log(data);
      },
      error: function(responseError){
        console.log(22222222222);
        console.log(responseError);
      }
      
    });
  });
}

2.3 MyUploadAction.java(继承自Action)

 

package com.rocky.console.action;

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

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

import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import org.apache.struts.upload.FormFile;

import com.rocky.console.form.MyUploadForm;
import com.rocky.console.service.ResponseUtil;


public class MyUploadAction extends Action {

  
  public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request,
      HttpServletResponse response) throws Exception{
    
    MyUploadForm myUploadForm = (MyUploadForm) form;
    FormFile uploadFile = myUploadForm.getUploadFile();
    String filetitle = myUploadForm.getFiletitle();
    System.out.println("111111"+filetitle);
    
    int fileSize = uploadFile.getFileSize();
    InputStream inputStream = uploadFile.getInputStream();
    System.out.println("fileSize::::::::"+fileSize);
    String path = "x:";
    String filename = path + File.separator + uploadFile.getFileName();
    FileOutputStream fos = new FileOutputStream(filename);
    byte[] b = new byte[1024];
    int len = -1;
    while((len = inputStream.read(b))!=-1){
      fos.write(b, 0, len);
    }
    fos.close();
    String result = "success";
    ResponseUtil.write(response, result, null);
    return null;
    
  }
}

 2.4 MyUploadForm.java( 继承自ActionForm)

package com.rocky.console.form;

import javax.servlet.http.HttpServletRequest;

import org.apache.struts.action.ActionErrors;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionMapping;
import org.apache.struts.upload.FormFile;

public class MyUploadForm extends ActionForm {

  /**
   * 
   */
  private static final long serialVersionUID = 6650496540449458586L;
  
  private FormFile uploadFile = null;
  
  private String filetitle;
  
  public String getFiletitle() {
    return filetitle;
  }

  public void setFiletitle(String filetitle) {
    this.filetitle = filetitle;
  }

  public ActionErrors validate(ActionMapping mapping,
      HttpServletRequest request) {
    return null;
  }
  
  public void reset(ActionMapping mapping, HttpServletRequest request) {
  }

  public FormFile getUploadFile() {
    return uploadFile;
  }

  public void setUploadFile(FormFile uploadFile) {
    this.uploadFile = uploadFile;
  }

}

2.5 struts-config.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts-config PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 1.2//EN" "struts-config_1_2.dtd">

<struts-config>
  <data-sources />
  <form-beans>
    <form-bean name="myUploadForm" type="com.rocky.console.form.MyUploadForm" />
  </form-beans>
  <global-exceptions />
  <global-forwards />
  <action-mappings>
    <!-- rocky myupload -->
    <action path="/myUpload" attribute="myUploadForm" name="myUploadForm" type="com.rocky.console.action.MyUploadAction" />
  </action-mappings>
  <message-resources parameter="ApplicationResources" />
</struts-config>

2.6 说明

2.6.1 jquery.form.js 网上可以下载

使用var formData = new FormData(), 然后formData.append("myfile", document.getElementById("myfile").files[0]);form.append...

当form表单field较多时 写很多 append很麻烦, 显然 ajaxSubmit方便很多

2.6.2 前端过来的数据 通过 ActionForm 直接封装到其子类(MyActionForm)对象中 , 用FormFile接收file文件 用String等接收其他类型数据

当然都是根据HTML 标签的name属性一一对应 来注入的

2.6.3 ActionForm是怎么和自定义实现的bean(MyUploadForm) 对上的?

在struts-config.xml中form-bean设置自己的那个bean,通过<action path="/myUpload" attribute="myUploadForm" name="myUploadForm"

来完成这种映射

以上这篇浅谈struts1 & jquery form 文件异步上传就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery插件HighCharts绘制2D饼图效果示例【附demo源码下载】
Mar 21 jQuery
jquery点赞功能实现代码 点个赞吧!
May 29 jQuery
基于jQuery和CSS3实现APPLE TV海报视差效果
Jun 16 jQuery
详解jQuery中关于Ajax的几个常用的函数
Jul 17 jQuery
深入研究jQuery图片懒加载 lazyload.js使用方法
Aug 16 jQuery
jQuery中extend函数简单用法示例
Oct 11 jQuery
Django中使用jquery的ajax进行数据交互的实例代码
Oct 15 jQuery
jQuery实现的滑块滑动导航效果示例
Jun 04 jQuery
jQuery滑动效果实现方法分析
Sep 05 jQuery
jQuery each和js forEach用法比较
Feb 27 jQuery
jQuery事件blur()方法的使用实例讲解
Mar 30 jQuery
jQuery对底部导航进行跳转并高亮显示的实例代码
Apr 23 jQuery
jquery Form轻松实现文件上传
May 24 #jQuery
解决jQuery ajax动态新增节点无法触发点击事件的问题
May 24 #jQuery
JQuery Ajax 异步操作之动态添加节点功能
May 24 #jQuery
使用jQuery.Pin垂直滚动时固定导航
May 24 #jQuery
jquery append与appendTo方法比较
May 24 #jQuery
jQuery日期范围选择器附源码下载
May 23 #jQuery
最常用的jQuery表单验证(简单)
May 23 #jQuery
You might like
PHP 数组入门教程小结
2009/05/20 PHP
基于ThinkPHP+uploadify+upload+PHPExcel 无刷新导入数据
2015/09/23 PHP
简单实现PHP留言板功能
2016/12/21 PHP
ThinkPHP5&amp;5.1框架关联模型分页操作示例
2019/08/03 PHP
为你的 Laravel 验证器加上多验证场景的实现
2020/04/07 PHP
js getElementsByTagName的简写方式
2010/06/27 Javascript
JS定时关闭窗口的实例
2013/05/22 Javascript
javascript实现文字图片上下滚动的具体实例
2013/06/28 Javascript
Web前端新人笔记之jquery入门心得(新手必看)
2016/05/17 Javascript
JS针对Array的各种操作汇总
2016/11/29 Javascript
TypeScript学习之强制类型的转换
2016/12/27 Javascript
关于jQuery中fade(),show()起始位置的一点小发现
2017/04/25 jQuery
使用npm安装最新版本nodejs
2018/01/18 NodeJs
Vue中的作用域CSS和CSS模块的区别
2018/10/09 Javascript
node.js爬取中关村的在线电瓶车信息
2018/11/13 Javascript
Next.js项目实战踩坑指南(笔记)
2018/11/29 Javascript
npm 常用命令详解(小结)
2019/01/17 Javascript
Vue3 响应式侦听与计算的实现
2020/11/11 Javascript
Python生成随机密码
2015/03/10 Python
python脚本爬取字体文件的实现方法
2017/04/29 Python
详解opencv Python特征检测及K-最近邻匹配
2019/01/21 Python
pytorch 输出中间层特征的实例
2019/08/17 Python
安装Pycharm2019以及配置anconda教程的方法步骤
2019/11/11 Python
Nginx+Uwsgi+Django 项目部署到服务器的思路详解
2020/05/08 Python
Python监听键盘和鼠标事件的示例代码
2020/11/18 Python
Python中的面向接口编程示例详解
2021/01/17 Python
美国羊皮公司:Overland
2018/01/15 全球购物
Europcar美国/加拿大:预订汽车或卡车租赁服务
2018/11/13 全球购物
CSMA/CD介质访问控制协议
2015/11/17 面试题
linux面试题参考答案(4)
2014/09/21 面试题
销售找工作求职信
2013/12/20 职场文书
2015年幼儿园毕业感言
2014/02/12 职场文书
合作意向书范本
2014/03/31 职场文书
优质护理服务演讲稿
2014/05/07 职场文书
社区春季防火方案
2014/06/02 职场文书
Go并发4种方法简明讲解
2022/04/06 Golang