FormData Values in Razor HTML page, getting in C# Method

Question

I have following input element in razor view page

<input type="file" id="uploadFile" name="FileUpload" multiple="multiple" />

using following script I'm binding data to this ForData

$('#uploadFile').on('change', function()
{

  var fd = new FormData();
  var files = $('#uploadFile')[0].files;


  for (var i = 0; i < files.length; i++) 
  {
    if (files[i].size < 5242880) 
    {       
       fd.append("myFiles", files[i])
    }
  }  
});

I'm trying to get these files in C# method like following

[HttpPost]        
public ActionResult SomeAction(ModelClass model)
{
    var attchaedfiles = System.Web.HttpContext.Current.Request.Files["myFiles"];

                for (int i = 0; i < attchaedfiles.Count; i++)
                {
                    if (!string.IsNullOrEmpty(attchaedfiles[i].FileName))
                    {
                      ....
                    }
                }
}

but here I'm getting folllowing errors

Operator '<' cannot be applied to operands of type 'int' and 'method group'

Cannot apply indexing with [] to an expression of type 'System.Web.HttpPostedFile'

Put a `List myFiles` parameter in the method and use `for (int i = 0; i < myFiles.Count; i++)` - or better have a property for it in your model and simply upload the model including the files as per [this answer](http://stackoverflow.com/questions/29293637/how-to-append-whole-set-of-model-to-formdata-and-obtain-it-in-mvc/29293681#29293681) — , Feb 25 '17 at 07:11
youre saying soming like this `List myFiles = System.Web.HttpContext.Current.Request.Files["myFiles"];` — kez, Feb 25 '17 at 07:33
No. Just add the parameter - it will be bound with the files — , Feb 25 '17 at 08:07
in html append like following `fd.append("myFiles", files[i]);` added to method like following, `public ActionResult SomeAction(ModelClass model, List myFiles)` but i can see values getting null :( — kez, Feb 25 '17 at 08:40
Then probably your ajax code is wrong (but you have not shown that). — , Feb 25 '17 at 08:58
i'm not binding these in ajax code, only within the `$('#uploadFile').on('change', function()` — kez, Feb 25 '17 at 09:39
What? You have to use ajax to post `FormData`! If you not using ajax, then just make the parameter `List FileUpload` to match the name of the form control and delete your scripts (they are pointless) — , Feb 25 '17 at 09:41
I just want to filter `$('#uploadFile')[0].files;` and insert validated files to Array or Formdata, then access those in C# method, how can I do this properly ? — kez, Feb 25 '17 at 09:47
Exactly as per my last message - `FormData` is a special object used when posting data using ajax. — , Feb 25 '17 at 09:49
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/136601/discussion-between-stephen-muecke-and-kez). — , Feb 25 '17 at 09:53

RickL · Answer 1 · 2017-02-25T11:34:45.843

In your ajax script, make sure you include these:

$.ajax({
    url: yourUrl,
    type: 'POST',
    // Needed for FormData submit
    processData: false,
    // Needed for FormData submit
    contentType: false,
    data: fd,
    dataType: 'json',
    success: function () {
        // Success things
    },
    error: function () {
        // Error things
    },
    complete: function () {
        // Complete things
    }
});

And that your form code includes enctype = "multipart/form-data":

@using (Html.BeginForm(null, null, FormMethod.Post, new { @action = YourAction, id = "your_id", enctype = "multipart/form-data" }))

Murat Yıldız · Answer 2 · 2023-02-07T21:22:40.873

Try the following approach that checks possible conditions regarding to file uploads:

Model:

public class ExperimentViewModel
{
    public int Id { get; set; }
    
    [DataType(DataType.Upload)]
    public IEnumerable<HttpPostedFileBase> FileUpload { get; set; }
    
    //other properties
}

Controller:

if (model.FileUpload != null)
{
    if (model.FileUpload.Count() > 0)
    {
        foreach (var upload in model.FileUpload)
        {
            if (upload != null && upload.ContentLength > 0)
            {
                //your stuff
            }
        }
    }
}

You can also look at my answer on How to display images in MVC.

FormData Values in Razor HTML page, getting in C# Method

2 Answers2