CODEWITHSUNDEEP
c#asp.net-mvctwitter-bootstrapfileinputstream
Michael
Michael

Reputation: 8739

Bootstrap fileinput with C# Controller

I am trying to use the Bootstrap FileInput with a C# Controller. No matter what I do, I can only seem to get the controller to accept 1 file (even when multiple files are selected)

my HTML:

<form enctype="multipart/form-data" method="post">
<label>Upload Photo </label>
<input id="FilesInput" name="FilesInput" type="file" multiple>
</form>

my Javascript:

  $('#FilesInput').fileinput({
    language: 'eN',
    uploadUrl: '/members/UploadSerivcePhoto',
    allowedFileExtensions: ['jpg', 'png', 'gif'],
});

and my MVC C# Controller

        [HttpPost]
    public void UploadSerivcePhoto(IEnumerable<HttpPostedFileBase> FilesInput)
    {
    //  only 1 file ever gets put in FilesInput. 
    }

Upvotes: 0

Views: 6260

Answers (2)

user3446300
user3446300

Reputation: 21

I think that it has something to do with asynchronous uploads, the plugin seems to have a default options to post files asynchronous in parallel so you will receive a single file per post.

So try to set the uploadAsync property to false.

$('#FilesInput').fileinput({
language: 'eN',
uploadAsync: 'false', 
uploadUrl: '/members/UploadSerivcePhoto',
allowedFileExtensions: ['jpg', 'png', 'gif'],

});

Here is some official documentation for Bootstrap Fileinput. Asynchronous Upload

Upvotes: 2

Dmitri Trofimov
Dmitri Trofimov

Reputation: 574

I had the same issue. Check the Request.Files property as @Michael mentioned, it should contain several files. When you check it, you should also filter out the ones with empty name:

List<HttpPostedFileBase> allFiles = Enumerable.Range(0, Request.Files.Count)
    .Select(x => Request.Files[x])
    .Where(x => !string.IsNullOrEmpty(x.FileName))
    .ToList();

Upvotes: 1

Related Questions