recherche

Maison >interface Web >js tutoriel >Partage d'exemple de téléchargement asynchrone de fichier de formulaire Struts1 et jquery

Partage d'exemple de téléchargement asynchrone de fichier de formulaire Struts1 et jquery

小云云
小云云original
2018-01-10 13:38:161533parcourir

Cet article vous apporte principalement une brève discussion sur le téléchargement asynchrone de fichiers de formulaire struts1 et jquery. L'éditeur pense que c'est plutôt bien, alors je vais le partager avec vous maintenant et le donner comme référence. Suivons l'éditeur pour y jeter un œil, j'espère que cela pourra aider tout le monde.

1. Présentation

Vous utilisez toujours les entretoises1 ? Oui, dans des endroits non écrits sur la terre, des méthodes de production rétrospectives sont toujours en cours d'exécution (anciens projets

Hérité de org.apache.struts.action.Action, hérité de org.apache.struts.action.ActionForm Let's). commencer

2. Code

2.1 page 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 (hérité d'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 (hérité d'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 Description

2.6.1 jquery.form.js peut être téléchargé en ligne

Utilisez var formData = new FormData(), puis formData.append("myfile", document.getElementById("myfile" ) .files[0]);form.append...

Lorsqu'il y a de nombreux champs de formulaire, il est difficile d'écrire de nombreux ajouts. Évidemment, ajaxSubmit est beaucoup plus pratique

2.6.2. Les données du front-end passent par ActionForm, les encapsulent directement dans son objet de sous-classe (MyActionForm), utilisent FormFile pour recevoir des fichiers et String pour recevoir d'autres types de données

Bien sûr, elles sont injectées selon le correspondance biunivoque de l'attribut name de la balise HTML

2.6.3 Comment ActionForm correspond-il au bean personnalisé implémenté (MyUploadForm) ?

Dans struts-config.xml, form-bean définit son propre bean via

Ce type de mappage

Recommandations associées :

Exemple de partage de code de téléchargement de fichiers asynchrones Ajax

Implémentation Javascript de la fonction de téléchargement de fichiers asynchrones Explication détaillée

Partage de l'utilisation du plug-in pour télécharger des fichiers de manière asynchrone à l'aide de jQuery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Java JavaScript jquery ajax html struts String 封装 子类 xml 继承 Attribute var append JS 对象 异步 apache
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：jQuery simule le partage d'exemples d'effets d'animation de panier d'achat TmallArticle suivant：jQuery simule le partage d'exemples d'effets d'animation de panier d'achat Tmall

Articles Liés

Voir plus