Unable to upload multiple files in Laravel using jQuery

Question

Environment:

Laravel Version: 5.7
PHP Version $ php --version: PHP PHP 7.1.3 (cli)
Database Driver & Version $ mysql --version: mysql Ver 8.0.23-0ubuntu0.20.04.1

Problem Statement:

Unable to dd code to iterate multiples file upload inside Controller. And dd($files) is returning last uploaded file instead file array or object

$files = $request->file('file');
        
foreach ($files as $file){
    dd($file);
}

Files & Configuration:

upload.blade.php

<form>
    <input name="file[]" class="form-control" type="file" id="file" multiple required>
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

<script>
    $("form").submit(function(evt){  
        evt.preventDefault();
        var formData = new FormData($(this)[0]);
    
        $.ajax({
            url: '{{ route('upload') }}',
            type: 'POST',
            data: formData,
            async: false,
            cache: false,
            contentType: false,
            enctype: 'multipart/form-data',
            processData: false,
            success: function (data) {
                console.log(data);
            }
        });
        return false;
    });
</script>

It's `dd` in the code or it's like an example here? because is _dump and die_ it will stop at the first loop (file). — Juan Eizmendi, Jul 28 '21 at 07:06
@JuanEizmendi `dd` is to check if i am able to get inside loop. — Maqsud, Jul 28 '21 at 07:08
so, in the request is the array of file?, or doing `console.log(formData)` — Juan Eizmendi, Jul 28 '21 at 07:20

A.A Noman · Accepted Answer · 2021-09-03T20:31:55.503

You have to use like this way

Form name should be like below

<form method="post" id="form_submit" enctype="multipart/form-data">
    @csrf
    ....

    <button type="submit" class="btn btn-success"><i class="fas fa-plus fa-xs"></i>Submit</button>

</form>

$(document).ready(function(){
    $('#form_submit').on('submit', function(event){
        event.preventDefault();
        $.ajax({
            url:'{{route('upload')}}',
            method:"POST",
            data:new FormData(this),
            dataType:'JSON',
            contentType: false,
            cache: false,
            processData: false,
            success:function(data){

            }
        })
    })
})

Unable to upload multiple files in Laravel using jQuery

Environment:

Problem Statement:

Files & Configuration:

1 Answers1

Linked