Я не могу передать свой файл httppostedfilebase в методе действий

Question

Я использую jquery form plugin, чтобы передать изображение моему методу действия. Кажется, я не могу установить httppostedfilebase в методе действий на моем контроллере на правильный тип данных.

$('#imageform').submit(function() { 
 
    var id = $('#selectedFile').data('id'); 
 
    //var filename = $('#selectedFile').val(); //.files[0]; 
 
    //var filename = document.getElementById('selectedFile').files[0]; 
 
    //var filename = input.files[0]; 
 
    var filename = $('#selectedFile').prop('files'); 
 
    var options = { 
 
     target: '#output', 
 
     enctype: 'multipart/form-data', 
 
     beforeSubmit: showRequest, 
 
     success: showResponse, 
 

 
     url: '/ManageSpaces/UploadImage', 
 
     data: { 
 
      id: id, 
 
      image: filename[0] 
 
     }, 
 
     type: 'post' 
 

 
    }; 
 
    $('#imageform').ajaxSubmit(options); 
 
    return false; 
 
});

Вот метод действия моего контроллера.

[HttpPost] 
    public ActionResult UploadImage(int id, HttpPostedFileBase image) 
    { 
     //do some stuff here 

     return Json("Saved"); 
    } 

HTML данные формы

<form id="imageform" enctype="multipart/form-data"> 
      <input type="file" id="selectedFile" name="selectedFile" style="display: none;" data-id='@Model.YogaSpaceId' /> 
      <input type="button" value="Add Photos" class="btn" id="pictureupload" /> 
     </form> 

Answer 1

$('#imageform').submit(function() { 
    var formData = new FormData(); 
    var totalFiles = document.getElementById("selectedFile").files.length; 
    for (var i = 0; i < totalFiles; i++) { 
     var file = document.getElementById("selectedFile").files[i]; 
     formData.append("FileUpload", file); 
    } 

    $.ajax({ 
     type: "POST", 
     url: '/Test/UploadImage/', //put your controller/action here 
     data: formData, 
     dataType: 'json', 
     contentType: false, 
     processData: false, 
     beforeSend: function (xhr) { 
      //do something before send 
     }, 
     success: function (data) { 
      //do something if success 
     }, 
     error: function (data) { 
      //do something if error 
     } 
    }); 
}); 

А затем в контроллере:

[HttpPost] 
public void UploadImage() 
{ 
    if (Request.Files.Count > 0) { 
     dynamic file = Request.Files(0); 
     //do something with your 'file' 
    } 
}