File upload bound to the Viewmodel

asp.net-mvc, file-upload, viewmodel

Solution

The fix to this is changing the way you Name and ID the upload control.

<%: Html.TextBoxFor(model => model.EmpName, new { maxLength = 50 })%>

Upload your files here: 
<input type="file" id="FileUploadPackets[0].UpFile" name="FileUploadPackets[0].UpFile" value="ActionHandlerForForm"  />
<%: Html.TextBoxFor(model => model.FileUploadPackets[0].UserEnteredDesc )%>

<input type="file" id="FileUploadPackets[1].UpFile" name="FileUploadPackets[1].UpFile" value="ActionHandlerForForm"  />
<%: Html.TextBoxFor(model => model.FileUploadPackets[1].UserEnteredDesc )%>

This worked for me!! Hope it helps anyone else out there..

Problem

I have a form where I am uploading multiple files and there are a couple of textboxes and some checkboxes associated with each file being uploaded. I have seen examples for uploading multiple files where the actionresult signature is something like this: ``` [HttpPost] public ActionResult Upload(IEnumerable<HttpPostedFileBase> fileUpload) ``` However, I cant find any example where I can have multiple files uploaded where my actionresult signature is something like this: ``` [HttpPost] public ActionResult Upload(MyViewModel vm) ``` The reason I want this viewmodel being posted is because I think its cleaner than using the FormCollection variable and because I want to each file being uploaded and the data added along with its associated textboxes to be grouped together by way of a `List<FileUploadPacket>` which will part of the ViewModel UPDATE My View model below: ``` public class EmployeeVM { public int EmployeeID {get ;set;} public string EmpName {get ;set;} //Other properties public List<FileUploadPacket> FileUploadPackets { get; set; } } ``` The FileUploadPacket class which has the property of type HttpPostedFileBase ``` public class FileUploadPacket { public int FileID {get ;set;} public string UserEnteredDesc {get ;set;} //some more other properties public HttpPostedFileBase UpFile { get; set; } } ``` Code snippet of my view.aspx as below ``` <%: Html.TextBoxFor(model => model.EmpName, new { maxLength = 50 })%> Upload your files here: <input type="file" id="UpFile" name="UpFile" value="ActionHandlerForForm" /> <%: Html.TextBoxFor(model => model.FileUploadPackets[0].UserEnteredDesc )%> <input type="file" id="UpFile" name="UpFile" value="ActionHandlerForForm" /> <%: Html.TextBoxFor(model => model.FileUploadPackets[1].UserEnteredDesc )%> ``` As you can see, I have all the other properties specific to this one file being uploaded kept in its own class. So that in my form an employee can enter his name and upload his files and provide some description and other details for each file. If I move the public `HttpPostedFileBase UpFile { get; set; }` property to the `EmployeeVM` class then I will have to collect all the files separately in an array and manually map a file to its description. Is there no way to do this keeping the `UpFile` property in the `FileUploadPacket` class itself? I am using the aspx view engine. Please help. Thanks for your time...

Original source