Hay una entrada (texto) en mi página para que los usuarios puedan insertar el nombre del archivo y cargar el archivo en sí, luego presione el botón Cargar.
Quiero enviar el archivo seleccionado y su nombre desde la entrada (texto) a mi controlador en una solicitud ajax .
Como funciona ?
Aquí está el código HTML:
<!--This is my upload section--> <div class="custom-file col-md-4"> <input type="file" class="custom-file-input" id="theFile" required=""> <label class="custom-file-label" for="theFile"></label> </div> <!--This is my input section--> <div class="col-sm-3"> <div class="form-group"> <label for="fileName">Enter the file name: </label> <input type="text" class="form-control" id="fileName" placeholder=""> </div> </div>Esto es lo que probé para el Código Ajax que no funciona:
var formData = new FormData(); formData.append('upload', $('#questionFile')[0].files[0]); $.ajax({ url:'the url of my controller is here', type: 'POST', data: { 'file' : formData, 'fileName' : $("#fileName").val() }, cache: false, processData: false, contentType: false })Aquí está mi método en mi controlador:
[HttpPost("getFile")] [AllowAnonymous] public IActionResult getFile(IFormFile file,string fileName) { //This is a method in my service project which uploads file SaveQuestionFile(file, fileName); return Ok("Uploaded"); }En Jquery pasa el archivo usando FormData
var fileData = new FormData(); var fileUpload = $("#fileId").get(0).files; fileData.append("FILE", fileUpload[0]); $.ajax({ type: "POST", contentType: false, processData: false, url: "url here", data: fileData, success: function (result) { }, error: function (data) { }, complete: function () { } }); En C# obtenga el archivo de la solicitud y los datos que se adjuntan
public IActionResult getFile() { List<IFormFile> files = (List<IFormFile>)Request.Form.Files; //if multiple foreach (IFormFile file in files) { string fileName = file.FileName; } }Debe agregar un archivo cuyo nombre sea file , y agregar un FileName cuyo nombre sea fileName a formData , para que pueda obtener el archivo y el nombre del archivo en acción:
var formData = new FormData(); formData.append('file', $('#theFile').get(0).files[0]); formData.append('fileName', $("#fileName").val()); $.ajax({ type: "POST", url: "the url of my controller is here", data: formData, processData: false, contentType: false, success: function (data) { } });