struts,jQuery 异步上传

来源:互联网 发布:总体国家安全观 知乎 编辑:程序博客网 时间:2024/06/06 20:07

jquery.ajaxfileupload.js文件经修改后如下:

jQuery.extend({
 createUploadIframe : function(id, uri) {
  // create frame
  var frameId = 'jUploadFrame' + id;
  if (window.ActiveXObject) {
   var io = document.createElement('<iframe id="' + frameId + '" name="' + frameId + '" />');
   if (typeof uri == 'boolean') {
    io.src = 'javascript:false';
   } else if (typeof uri == 'string') {
    io.src = uri;
   }
  } else {
   var io = document.createElement('iframe');
   io.id = frameId;
   io.name = frameId;
  }
  io.style.position = 'absolute';
  io.style.top = '-1000px';
  io.style.left = '-1000px';
  document.body.appendChild(io);
  return io;
 },
 createUploadForm : function(id, fileElementId, data) {
  // create form
  var formId = 'jUploadForm' + id;
  var fileImageId = 'jUploadImageFile' + id;
  var fileId = 'jUploadFile' + id;
  var form = jQuery('<form  action="" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-data"></form>');
  if(fileElementId == 'addProduct' || fileElementId == 'editProduct')
  {
      var oldElementOfProduct = jQuery('#productImageUpload');
   var oldElement = jQuery('#productUpload');
   var newElementOfImage = jQuery(oldElementOfProduct).clone();
   var newElement = jQuery(oldElement).clone();
   jQuery(oldElementOfProduct).attr('id', fileImageId);
   jQuery(oldElement).attr('id', fileId);
   jQuery(oldElementOfProduct).before(newElementOfImage);
   jQuery(oldElement).before(newElement);
   jQuery(oldElement).appendTo(form);
   jQuery(oldElementOfProduct).appendTo(form);
   
  }else{
   var fileUploadList = $("input[type=file][name=productUpload]");
   for(var i=0; i<fileUploadList.length; i++){
    var id = fileUploadList[i].id;
    var value = fileUploadList[i].value;
    if(value != null && value != ''){
     var oldElement = jQuery('#' + id);
     var newElement = jQuery(oldElement).clone();
     jQuery(oldElement).attr('id', fileId);
     jQuery(oldElement).before(newElement);
     jQuery(oldElement).appendTo(form);
    }
   }
  }
        //增加文本参数的支持
        if (data) { 
            for (var i in data) { 
                $('<input type="hidden" name="' + i + '" value="' + data[i] + '" />').appendTo(form); 
            } 
        } 

  // set attributes
  jQuery(form).css('position', 'absolute');
  jQuery(form).css('top', '-1200px');
  jQuery(form).css('left', '-1200px');
  jQuery(form).appendTo('body');
  return form;
 },
 ajaxFileUpload : function(s) {
  // TODO introduce global settings, allowing the client to modify them for all requests, not only timeout
  s = jQuery.extend( {}, jQuery.ajaxSettings, s);
  var id = s.fileElementId;
  var form = jQuery.createUploadForm(id,s.fileElementId, s.data);
  var io = jQuery.createUploadIframe(id, s.secureuri);
  var frameId = 'jUploadFrame' + id;
  var formId = 'jUploadForm' + id;
  if (s.global && !jQuery.active++) {
   // Watch for a new set of requests
   jQuery.event.trigger("ajaxStart");
  }
  var requestDone = false;
  // Create the request object
  var xml = {};
  if (s.global) {
   jQuery.event.trigger("ajaxSend", [ xml, s ]);
  }
  var uploadCallback = function(isTimeout) {
   // Wait for a response to come back
   var io = document.getElementById(frameId);
   try {
    if (io.contentWindow) {
     xml.responseText = io.contentWindow.document.body ? io.contentWindow.document.body.innerHTML : null;
     xml.responseXML = io.contentWindow.document.XMLDocument ? io.contentWindow.document.XMLDocument : io.contentWindow.document;
 
    } else if (io.contentDocument) {
     xml.responseText = io.contentDocument.document.body ? io.contentDocument.document.body.innerHTML : null;
     xml.responseXML = io.contentDocument.document.XMLDocument ? io.contentDocument.document.XMLDocument : io.contentDocument.document;
    }
   } catch (e) {
    jQuery.handleError(s, xml, null, e);
   }
   if (xml || isTimeout == "timeout") {
    requestDone = true;
    var status;
    try {
     status = isTimeout != "timeout" ? "success" : "error";
     // Make sure that the request was successful or notmodified
     if (status != "error") {
      // process the data (runs the xml through httpData regardless of callback)
      var data = jQuery.uploadHttpData(xml, s.dataType);
      if (s.success) {
       // ifa local callback was specified, fire it and pass it the data
       s.success(data, status);
      }
      ;
      if (s.global) {
       // Fire the global callback
       jQuery.event.trigger("ajaxSuccess", [ xml, s ]);
      }
      ;
     } else {
      jQuery.handleError(s, xml, status);
     }
 
    } catch (e) {
     status = "error";
     jQuery.handleError(s, xml, status, e);
    }
    ;
    if (s.global) {
     // The request was completed
     jQuery.event.trigger("ajaxComplete", [ xml, s ]);
    }
    ;
    // Handle the global AJAX counter
    if (s.global && !--jQuery.active) {
     jQuery.event.trigger("ajaxStop");
    }
    ;
    if (s.complete) {
     s.complete(xml, status);
    }
    ;
    jQuery(io).unbind();
    setTimeout( function() {
     try {
      jQuery(io).remove();
      jQuery(form).remove();
 
     } catch (e) {
      jQuery.handleError(s, xml, null, e);
     }
 
    }, 100);
    xml = null;
   }
   ;
  }
  // Timeout checker
  if (s.timeout > 0) {
   setTimeout( function() {
 
    if (!requestDone) {
     // Check to see ifthe request is still happening
     uploadCallback("timeout");
    }
   }, s.timeout);
  }
  try {
   var form = jQuery('#' + formId);
   jQuery(form).attr('action', s.url);
   jQuery(form).attr('method', 'POST');
   jQuery(form).attr('target', frameId);
   if (form.encoding) {
    form.encoding = 'multipart/form-data';
   } else {
    form.enctype = 'multipart/form-data';
   }
   jQuery(form).submit();
 
  } catch (e) {
   jQuery.handleError(s, xml, null, e);
  }
  if (window.attachEvent) {
   document.getElementById(frameId).attachEvent('onload', uploadCallback);
  } else {
   document.getElementById(frameId).addEventListener('load', uploadCallback, false);
  }
  return {
   abort : function() {
   }
  };
 },
 uploadHttpData : function(r, type) {
  var data = !type;
  data = type == "xml" || data ? r.responseXML : r.responseText;
  // ifthe type is "script", eval it in global context
  if (type == "script") {
   jQuery.globalEval(data);
  }
  // Get the JavaScript object, ifJSON is used.
  if (type == "json") {
   //eval("data = " + data);
  }
  // evaluate scripts within html
  if (type == "html") {
   jQuery("<div>").html(data).evalScripts();
  }
  return data;
 }
});

java文件--单文件上传

 private File productImageUpload;

 private String productImageUploadFileName;

 private String productImageUploadFileContentType;  

 String targetImageDirectory = this.getHttpServletRequest()
     .getRealPath("/upload");
   String targetImageFileName = generateFileName(productImageUploadFileName);
   File targetImage = new File(targetImageDirectory,
     targetImageFileName);
   FileUtils.copyFile(productImageUpload, targetImage);

java文件--多文件上传

 private File[] productUpload;

 private String[] productUploadFileName;

 private String[] productUploadFileContentType;

 for (int i = 0; i < productUpload.length; i++) {
    String targetImageDirectory = this.getHttpServletRequest()
      .getRealPath("/upload");
    String targetImageFileName = generateFileName(productUploadFileName[i]);
    File targetImage = new File(targetImageDirectory,
      targetImageFileName);
    FileUtils.copyFile(productUpload[i], targetImage);
    productImageBean.setUploadPath(targetImageDirectory + "/"
      + targetImageFileName);
    productImageService.addProductImage(productImageBean);
   }

提交js

$.ajaxFileUpload( {
    url : window.BIZCTX_PATH + "/productpro/addProduct.action", // 请求路径
    secureuri : false,
    fileElementId : 'addProduct',
    dataType : 'json',
    data : {// 参数
     'productBean.productName' : document
       .getElementById('productBean.productName').value,
     'productBean.categoryId' : document
       .getElementById('productBean.categoryId').value,
     'productBean.provideName' : document
       .getElementById('productBean.provideName').value,
     'productBean.version' : document
       .getElementById('productBean.version').value,
     'productBean.size' : document
       .getElementById('productBean.size').value,
     'productBean.price' : document
       .getElementById('productBean.price').value,
     'productBean.description' : document
       .getElementById('productBean.description').value
    },
    error : function(request,textStatus,errorThrown) {
     if(textStatus == 'error'){
      //alert(errorThrown);
      alert(errorThrown.responseText);
     }
    },
    success : showMsg
   });

原创粉丝点击