Question

I have text input fields and multiple file uploads inside one form. I don’t know the number of files or other fields until runtime.

<form action="/WorkOrder/Install" enctype="multipart/form-data" method="post">    
        <div class="display-label">
            Description
        </div>

        <input id="description" name="description" type="text" value="" />

        <div class="display-label">
            Photo - Before Install 
        </div>

        <input name="files" id="file1" type="file" />

        <div class="display-label">
            Photo - After Install 
        </div>

        <input name="files" id="file2" type="file" />

        <input type="submit"/>
</form>

The FormCollection is being populated, but the HttpPostedFileBase collection is always null. Request.Files is empty.

    [HttpPost]
    public ActionResult Install(FormCollection formCollection, IEnumerable<HttpPostedFileBase> files)
    {
        return View();
    }

I tried having only one file input and changing the controller to accept a single HttpPostedFileBase, and the problem is the same.

Answer 1

jQuery Mobile was trying to handle the form submission. I had to set data-ajax=”false” on the form to let the MVC controller handle the file upload.