Laravel 5.8 file upload using PUT method with ajax

Question

I'm trying to update a file using a PUT method with ajax. For whatever reason I can't send a request in my controller. I created a custom validator to check whether a file is missing or a certain input request is missing. It keeps on returning 422 file is missing and name is missing. What do I miss? Here's my code below.

<script>
    $(document).ready(function() {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $('#news_id').on('submit', function(e) {
            e.preventDefault();
            var data = new FormData();
            var newsletter_name = $('#newsletter_name').val();
            var newsletter_file = $('#newsletter_file')[0].files[0];
            data.append('newsletter_name', newsletter_name);
            data.append('newsletter_file', newsletter_file);
            var id = $('#hidden_id').val();
            console.log(newsletter_file);
            $.ajax({
                url: '/admin/newsletter/' + id,
                type: 'PUT',
                data: data,
                contentType: false,
                processData: false,
                beforeSend: function(data) {

                },
                success: function(data) {
                    console.log('success');
                },
                error: function(data) {
                    console.log(data)
                },
            });
        });
    });
</script>

Here's my html code

<div class="container mt-5">
  <div class="col-md-6">
       <form action="" method="" enctype="multipart/form-data" id="news_id">
            @method('PUT')
            <div class="form-group">
                <label for="newsletter_name">Name</label>
                <input type="text" value="{{$newsletter->newsletter_name}}" name="newsletter_name" id="newsletter_name" class="form-control" placeholder="" aria-describedby="helpId">
                <input type="hidden" name="hidden_id" id="hidden_id" value="{{$newsletter->newsletter_id}}">
                <input type="hidden" name="_method" value="PUT">
            </div>
            <div class="input-group mb-3">
                <div class="custom-file">
                    <input name="newsletter_file" type="file" class="custom-file-input" id="newsletter_file" aria-describedby="inputGroupFileAddon03">
                    <label class="custom-file-label" for="newsletter_file">Choose file</label>
                </div>
            </div>
            <div>
                <button class="btn btn-primary btn-block" type="submit">UPDATE</button>
            </div>
        </form>
    </div>
</div>

Adrian Edy Pratama · Accepted Answer · 2019-12-13 02:33:23Z

2

Add data.append('_method', 'PUT'); then change your request type to type: 'POST' Because some browser can't send a PUT request, so Laravel can do receive a PUT request by receiving _method data.

answered Dec 13, 2019 at 2:33

Adrian Edy Pratama

4,1012 gold badges12 silver badges24 bronze badges

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

1 Comment

eugenebermudez Over a year ago

Thanks bro. I didn't know that I should append PUT method in my form data alongside with my requests.

Collectives™ on Stack Overflow

Laravel 5.8 file upload using PUT method with ajax

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related