¿Cómo paso un objeto de modelo de conjunto completo a través de formdata y lo convierto en tipo de modelo en el controlador?
A continuación se muestra lo que he intentado!
Parte de JavaScript:
model = { EventFromDate: fromDate, EventToDate: toDate, ImageUrl: imgUrl, HotNewsDesc: $("#txthtDescription").val().trim(), }; formdata.append("model",model); luego páselo a través de AJAX, será una cadena, y si compruebo el valor de Request.Form["model"] el resultado será el mismo, es decir, se recibirá como cadena y el valor será "[object object]"
¿Hay alguna forma de pasar el modelo a través de formdata y recibirlo en el controlador?
Si su vista se basa en un modelo y ha generado los controles dentro de las etiquetas <form> , puede serializar el modelo en FormData usando
var formdata = new FormData($('form').get(0)); Esto también incluirá cualquier archivo generado con <input type="file" name="myImage" .../>
y publícalo usando
$.ajax({ url: '@Url.Action("YourActionName", "YourControllerName")', type: 'POST', data: formdata, processData: false, contentType: false, });y en tu controlador
[HttpPost] public ActionResult YourActionName(YourModelType model) { } o (si su modelo no incluye una propiedad para HttpPostedFileBase )
[HttpPost] public ActionResult YourActionName(YourModelType model, HttpPostedFileBase myImage) { }Si desea agregar información adicional que no está en el formulario, puede agregarla usando
formdata.append('someProperty', 'SomeValue');Si desea enviar datos de formulario usando Ajax. Esta es la forma de enviar
var formData = new FormData(); //File Upload var totalFiles = document.getElementById("Iupload").files.length; for (var i = 0; i < totalFiles; i++) { var file = document.getElementById("Iupload").files[i]; formData.append("Document", file); } formData.append("NameCode", $('#SelecterID').val()); formData.append("AirLineCode", $('#SelecterID').val()); $.ajax({ url: "/Controller/ActionName", type: "POST", dataType: "JSON", data: formData, contentType: false, processData: false, success: function (result) { } })Usando Pure Javascript, considerando que tiene
<form id="FileUploadForm"> <input id="textInput" type="text" /> <input id="fileInput" type="file" name="fileInput" multiple> <input type="submit" value="Upload file" /> </form>JS
document.getElementById('FileUploadForm').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]); } //text value formdata.append("textvalue",document.getElementById("textInput").value); //Creating an XMLHttpRequest and sending var xhr = new XMLHttpRequest(); xhr.open('POST', '/Home/UploadFiles'); xhr.send(formdata); // se xhr.onreadystatechange = function () { if (xhr.readyState == 4 && xhr.status == 200) { //on success alert response alert(xhr.responseText); } } return false; }en su controlador C # puede obtener valores como se muestra a continuación
[HttpPost] public ActionResult UploadFiles(YourModelType model, HttpPostedFileBase fileInput) { //save data in db }Referencia: Carga de archivos usando jQuery Ajax o Javascript en MVC