Flask request.files.getlist() appearing to be empty on post request

Question

I am trying to upload multiple files using flask. But I am getting empty list after submitting the form. here is my HTML form code:

<form enctype="multipart/form-data" action="/upload" method="post" role="form">
              <div class="form-row">
                <div class="col-lg-6 form-group">
                  <input type="text" name="name" class="form-control" id="name" placeholder="Your Name" data-rule="minlen:4" data-msg="Please enter at least 4 chars" required />
                  <div class="validate"></div>
                </div>
                <div class="col-lg-6 form-group">
                  <input type="email" class="form-control" name="email" id="email" placeholder="Your Email" data-rule="email" data-msg="Please enter a valid email" required />
                  <div class="validate"></div>
                </div>
              </div>
              <div class="form-group">
                <input type="tel" class="form-control" name="phone" id="subject" placeholder="Phone Number" data-rule="minlen:4" data-msg="Please enter your phone number" required />
                <div class="validate"></div>
              </div>
              <div class="form-group">
                <select name="cata" class="browser-default custom-select">
                  <option selected>Culture, Arts and Social Scineces</option>
                  <option value="1">Medicine and Health</option>
                  <option value="2">Leadership, Managment, Buisness and Commerce</option>
                  <option value="3">Sceince, Agriculture and Engineering</option>
                  <option value="3">Other</option>
                </select>
              </div>
              <div class="form-group">
                <textarea class="form-control-a" name="message" rows="5" data-rule="required" data-msg="Please write something for us" placeholder="Message"></textarea>
                <div class="validate"></div>
              </div>
              <div class="mb-3">
                <!-- <div class="loading">Loading</div>
                <div class="error-message"></div>
                <div class="sent-message">Your message has been sent. Thank you!</div> -->
              </div>
                <strong>Upload File:
                   <input type="file" name="atta_file[]" multiple>
                </strong>
                <input type="submit" style="border-radius: 5px;
                                            width: 110px;
                                            margin: 14px;
                                            height: 50px;
                                            line-height: 0;" 
                        class="btn btn-primary pull-right" 
                        value="Submit">
            </form>

And here is my Python script for uploading file:

@app.route("/upload", methods=['POST','GET'])
def upload():
    if request.method == 'POST':
        filess = request.files.getlist('atta_file[]')
        print(filess)
        return render_template("upload.html")
    return render_template("upload.html")

Initially I am trying to print submitted file names on console, to see if it is working or not. I have looked for other answers also for same the query but I found that in their problem they only missing enctype="multipart/form-data" or name field in input tag. but I have checked in my code none of them are missing. I am not sure what I am missing and how to resolve this issue.

when I run your code I get list with all files. The only idea you use different `upload.html` - you should check HTML source in web browser (`Ctrl+U`) — furas, Aug 02 '20 at 22:21

score 0 · Answer 1 · answered Oct 23 '20 at 17:55

I don't know if you still need help with this. But I had the same problem and I think I found a solution. Well, in my case, I am using an ajax request to send the files.

I realized that when I indexed in the var used to send the files, in python I got just one file and after I found this example.

So using this example as reference.

JavaScript Code:

var form_data = new FormData();
var auxnames = "";
var wordsF = $("#word").prop("files");
$.each(wordsF, function(i, file){
    form_data.append(file.name, file);
    auxnames += file.name+',';
});
form_data.append('auxindex', auxnames);
$.ajax({
    url: $SCRIPT_ROOT + "/upload_files",
    type:"post",
    data:form_data,
    contentType: false,
    cache: false,
    processData: false,
}).done(function(response){ ...

Python code:

if request.method == 'POST':
    auxindex = request.form['auxindex']
    auxindex = auxindex.split(",")
    auxindex = list(filter(None, auxindex))
    for file in auxindex:
        auxfile = request.files[file]
        namefile = secure_filename(file)
        auxfile.save(os.path.join(path, namefile))

maybe isn't the best way but it works for me, I hope this would be useful for you.

score 0 · Answer 2 · answered Jan 30 '22 at 01:35

I'm having a similar issue. I've seen it recommended to use request.files.getlist("file[]") or request.files.getlist("file") << this worked for me for 2 files but when I started upload 3 separate files via 3 form elements I would only get 2. So here's the code I'm using right now.

for file in request.files:
    files[file].save(out_filename)

Flask request.files.getlist() appearing to be empty on post request

2 Answers2