2013-08-21 24 views
2

我试图上传文件到服务器,但是当我提交表单时它不会调用ActionResult。它在铬,FF中工作,但不在IE中。当我从形式在IE中除去ENCTYPE =“多部分/格式数据”属性,那么它调用方法,但没有文件上传...jQuery表单插件不会调用IE 8中的方法

我有这样的输入:

<input id="jqueryfileupload" type="file" name="files" data-upload-id="@documentUniqueId" 
data-url="@Url.Action(MVC.Profile.Documents().AddRouteValue("documentUniqueId", documentUniqueId))" multiple> 

jQuery代码:

$(document).on('change', '.documents-upload-container #jqueryfileupload', function (e) { 
     e.preventDefault(); 
     e.stopPropagation(); 
     var $this = $(this); 
     //input itself is not in the form tag, so i am creating form here and 
     //submitting it this way 
     var formContainer = $('<form action="' + $this.data('url') + '" enctype="multipart/form-data" method="POST"></form>'); 
     $this.appendTo(formContainer); 
     var contentTypeOption = $.browser.msie ? 'text/html' : 'application/json'; 
     var iframeOption = $.browser.msie ? true : false; 
     var options = { 
      dataType: 'json', 
      //contentType: contentTypeOption, 
      //iframe: iframeOption, 
      method: 'POST', 
      success: function (response, textStatus, xhr, form) { 
       alert(response); 
      }, 
      error: function (xhr, textStatus, errorThrown) { 

       alert(xhr); 
       alert(textStatus); 
       alert(errorThrown); 
      }, 
      clearForm: true 
     }; 

     $(formContainer).ajaxSubmit(options); 
     return false; 
    }); 

有没有错误和警告都没有在IE扔在所有。只是方法不叫......

操作方法:

[HttpPost] 
public virtual ActionResult Documents(IEnumerable<HttpPostedFileBase> files, string documentUniqueId) 
{ 
    var result = new ContentResult(); 
    if (files != null) 
    { 
     foreach (var item in files) 
     { 
      string docName = documentUniqueId + "_" + item.FileName; 
      var filename = Path.Combine(Server.MapPath("~/App_Data"), docName); 
      item.SaveAs(filename); 
     } 

     var docs = files.Select(x => new 
     { 
      url = Url.Action(MVC.Profile.Documents(documentUniqueId + "_" + x.FileName, x.ContentType)), 
      name = x.FileName, 
      contentType = x.ContentType, 
      id = documentUniqueId + "_" + x.FileName 
     }); 

     result.Content = new JavaScriptSerializer().Serialize(docs); 
     return result; 
    } 
    result.Content = new JavaScriptSerializer().Serialize(new { success = false }); 
    return result; 
} 

[HttpGet] 
public virtual ActionResult Documents(string fileName, string contentType) 
{ 
    var docPath = Path.Combine(Server.MapPath("~/App_Data"), fileName); 
    return File(docPath, contentType); 
} 

我使用这个插件:http://malsup.com/jquery/form/

回答

2

我想你是不是插入的页面形式。那就是问题所在。您必须添加formContainer.appendTo(容器); 试试这个代码:

$(document).on('change', '.documents-upload-container #jqueryfileupload', function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    var $this = $(this); 
    var container = $this.parents('.documents-upload-container').addClass("current-container"); 
    var formContainer = $('<form action="' + $this.data('url') + '" enctype="multipart/form-data" method="post"></form>'); 
    $this.appendTo(formContainer); 
    formContainer.appendTo(container); 
    var contentTypeOption = $.browser.msie ? 'text/plain' : 'application/json'; 
    var iframeOption = $.browser.msie ? true : false; 

    var options = { 
     dataType: 'json', 
     contentType: contentTypeOption, 
     //iframe: iframeOption, 
     method: 'POST', 
     //data: { 'isIE': iframeOption }, 
     success: function (response, textStatus, xhr, form) { 
     alert(response); 
     }, 
     error: function (xhr, textStatus, errorThrown) { 
     alert(xhr); 
     alert(textStatus); 
     alert(errorThrown); 
     }, 
    clearForm: true 
    }; 

    formContainer.ajaxSubmit(options);  
    return false; 
});