Archivo de carga jQuery ajax en asp.net mvc

Tengo un archivo en mi vista

y una solicitud de ajax

 $.ajax({ url: '', dataType: 'json', processData: false, contentType: "multipart/mixed", data: { Id: selectedRow.Id, Value: 'some date was added by the user here :))' }, cache: false, success: function (data) {} }); 

pero no hay ningún archivo en Request.Files . ¿Qué pasa con la solicitud de Ajax?

Cargue archivos usando AJAX en ASP.Net MVC

Las cosas han cambiado desde HTML5

JavaScript

 document.getElementById('uploader').onsubmit = function () { var formdata = new FormData(); //FormData object var fileInput = document.getElementById('fileInput'); //Iterating through each files selected in fileInput for (i = 0; i < fileInput.files.length; i++) { //Appending each file to FormData object formdata.append(fileInput.files[i].name, fileInput.files[i]); } //Creating an XMLHttpRequest and sending var xhr = new XMLHttpRequest(); xhr.open('POST', '/Home/Upload'); xhr.send(formdata); xhr.onreadystatechange = function () { if (xhr.readyState == 4 && xhr.status == 200) { alert(xhr.responseText); } } return false; } 

Controlador

 public JsonResult Upload() { for (int i = 0; i < Request.Files.Count; i++) { HttpPostedFileBase file = Request.Files[i]; //Uploaded file //Use the following properties to get file's name, size and MIMEType int fileSize = file.ContentLength; string fileName = file.FileName; string mimeType = file.ContentType; System.IO.Stream fileContent = file.InputStream; //To save file, use SaveAs method file.SaveAs(Server.MapPath("~/")+ fileName ); //File will be saved in application root } return Json("Uploaded " + Request.Files.Count + " files"); } 

EDITAR : El HTML

 

Las cargas de archivos AJAX ahora son posibles al pasar un objeto FormData a la propiedad de data de la solicitud $.ajax .

Como OP solicitó específicamente una implementación de jQuery, aquí tiene:

 

 $('#upload').submit(function(e) { e.preventDefault(); // stop the standard form submission $.ajax({ url: this.action, type: this.method, data: new FormData(this), cache: false, contentType: false, processData: false, success: function (data) { console.log(data.UploadedFileCount + ' file(s) uploaded successfully'); }, error: function(xhr, error, status) { console.log(error, status); } }); }); 
 public JsonResult Survey() { for (int i = 0; i < Request.Files.Count; i++) { var file = Request.Files[i]; // save file as required here... } return Json(new { UploadedFileCount = Request.Files.Count }); } 

Más información sobre FormData en MDN

No puede cargar archivos a través de ajax, necesita usar un iFrame u otro truco para hacer una devolución de datos completa. Esto se debe principalmente a problemas de seguridad.

Aquí hay un artículo decente que incluye un proyecto de muestra que usa SWFUpload y ASP.Net MVC de Steve Sanderson. Es lo primero que leo para que funcione correctamente con Asp.Net MVC (en ese momento también era nuevo para MVC), espero que sea tan útil para usted.

Si publicas el formulario usando ajax y luego no puedes enviar la imagen usando el método $ .ajax, tienes que usar el método clásico xmlHttpobject para guardar la imagen, otra alternativa es usar el tipo de enviar en lugar del botón

Tengo una muestra como esta en la versión vuejs: v2.5.2