I'm trying to create an EditorTemplate for MVC4 for all my file inputs, I'm using blueimp jquery-file-upload plugin, and it's working great, however I have some doubts with the editor template:
I have a class to bind to the editor template like this:
public class FileUpload
{
public int Id { get; set; }
public string FileName { get; set; }
public string TempFileName { get; set; }
public bool Deleted { get; set; }
public bool Modified { get; set; }
...
public class MultiFileUpload : List<FileUpload>
{
}
and in my ViewModel where I want to upload a file I have this:
public class TestModel
{
[Required]
[MaxLength(3)]
public MultiFileUpload File { get; set; }
}
this is my EditorTemplate (/Views/Shared/EditorTemplates/MultiFileUpload.cshtml):
@model MultiFileUpload
<div class="file-upload">
<ul class="list-group files-list">
@for (var i = 0; i < Model.Count; i++)
{
<li class='list-group-item'>
@Html.HiddenFor(m => m[i].Id)
@Html.HiddenFor(m => m[i].Deleted)
@Html.HiddenFor(m => m[i].TempFileName)
@Html.HiddenFor(m => m[i].FileName)
@Model[i].FileName
<a href="#" class="delete pull-right" style="margin-right:-15px; text-decoration:none;"><i class="icon-remove"></i></a>
</li>
}
</ul>
<span class="btn btn-default fileinput-button">
<i class="icon-plus"></i>
<span>Add File</span>
<input type="file" name="" data-url="api/fileupload" data-single="false" />
</span>
</div>
I want to have client validation of my File property in TestModel (MaxLength would be the number of files the user can upload), how can I do that?
or, is there any other recommended way of doing this file upload kind of modular in mvc4?.