How to append multiple files into formdata using jquery

Question

I am using a input type file with multiple attribute. I want to save the files into a folder. But i am not sure how to append multiple files. Help will be greatly appreciated.

Script

$(document).on('click', '.btnSubmit', function () {
     var data = new FormData();
        var files = $('[type="file"]').get(0).files;

        if (files.length > 0) {
         _.each(files, function (program, idx) {
                data.append("file", program);
            });
        }
        _appFun._ajaxcall({
                type: "POST",
                url: '/application/test/saveFiles',
                type: 'POST',
                data: data,
                cache: false,
                contentType: false,
                processData: false,
                success: function (data) {
                    //show content
                    alert('Success!')
                }
           });
});

C#

[HttpPost]
    public ActionResult saveFiles()
    {

        string directory = AppSettings.Application.uploadFolder;


        HttpPostedFileBase file = Request.Files["file"];

        if (file != null && file.ContentLength > 0)
        {
            var fileName = Path.GetFileNameWithoutExtension(file.FileName);

            string extension = Path.GetExtension(file.FileName);

            var randomId = uniqId();

            file.SaveAs(Path.Combine(directory, fileName + randomId + extension));
        }
        return RedirectToAction("Index");
    }

data.append("file", program); I think each file must have an unique id. You are trying to name them all "file". Not sure, though — Artur Trapp
– Artur Trapp, Commented May 23, 2018 at 12:40

Keith · Accepted Answer · 2018-05-23 12:44:51Z

2

If you are trying to cycle through the same input area, you can do:

var data = new FormData();
var files = $('[type="file"]')[0].files;

if (files.length > 0) {
    var count = 0;
    $(files).each(function(i, value){
        count++;
        var variableName = "name" + count;
        data.append(variableName, value[i].files[0]);
    }
}

answered May 23, 2018 at 12:44

Keith

4,1512 gold badges34 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to append multiple files into formdata using jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related