In MVC4 file upload its saving "System.Web.HttpPostedFileWrapper" in DB instead of file name - asp.net-mvc-4

Question

I'm trying to do a file-upload using MVC4 but its saving object name "System.Web.HttpPostedFileWrapper" in DB instead of file name i.e. "Songs.MP3", also file is not transferred to given location.
MODEL
public class FileUpload
{
[Key]
public int FileUploadID { get; set; }
public int AlbumID { get; set; }
public string FileType { get; set; }
public string FileUploadLocation { get; set; }
public virtual Albums Albums { get; set; }
}
View
#using (Html.BeginForm("Create", "FileUpload", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<div class="editor-label">
#Html.LabelFor(model => model.FileUploadLocation)
</div>
<div class="editor-field">
#Html.TextBoxFor(model => model.FileUploadLocation, new { type = "file", accept = "FileUploadLocation/*" })
#Html.ValidationMessageFor(model => model.FileUploadLocation)
</div>
Controller
//
// POST: /FileUpload/Create
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(FileUpload fileupload, HttpPostedFileBase FileUploadLocation)
{
if (ModelState.IsValid)
{
var fileName = Path.GetFileName(FileUploadLocation.FileName);
var path = Path.Combine(Server.MapPath("~/Images/Files"), fileName);
FileUploadLocation.SaveAs(path);
db.FileUploads.Add(fileupload);
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.AlbumID = new SelectList(db.Albumss, "AlbumID", "AlbumTitle", fileupload.AlbumID);
return View(fileupload);
}
file is not available in ~/Images/Files location.

Answer 1

There are few issues here. First issue is naming convention. Your FileUpload model has property FileUploadLocation as string and in your Create method in controller, you are passing FileUpload fileupload model and HttpPostedFileBase FileUploadLocation.
Other more important issue is that you should not be saving View Model to the database, it should be mapped to some kind of domain object, which in turn would be saved. For example:
Create new View Model:
public class FileUploadViewModel
{
public int FileUploadID { get; set; }
public int AlbumID { get; set; }
public string FileType { get; set; }
public HttpPostedFileBase FileUploadFile { get; set; }
public virtual Albums Albums { get; set; }
}
Remove virtual method(s) from your domain model:
public class FileUpload
{
[Key]
public int FileUploadID { get; set; }
public int AlbumID { get; set; }
public string FileType { get; set; }
public string FileUploadLocation { get; set; }
}
Then your Controller Create method should look something like this:
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(FileUploadViewModel model)
{
if (ModelState.IsValid)
{
var fileName = Path.GetFileName(model.FileUploadFile.FileName);
var path = Path.Combine(Server.MapPath("~/Images/Files"), fileName);
model.FileUploadFile.SaveAs(path);
db.FileUploads.Add(new FileUpload
{
FileUploadID = model.FileUploadID,
AlbumID = model.AlbumID,
FileType = model.FileType,
FileUploadLocation = path
});
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.AlbumID = new SelectList(db.Albumss, "AlbumID", "AlbumTitle", model.AlbumID);
return View(model);
}