Method Not Allowed Http Exception Ajax Request

Question

I am trying to update some data via ajax in laravel 5, But I am facing MethodNotAllowed Http Exception.

So, I have created a resource route in web.php, an HTML form to get some data prefilled in the textboxes, and some ajax code.

Code For Web.php, prefixed via admin.

Route::resource('settings', 'OrganisationSettingsController', ['only' => ['edit', 'update', 'index', 'change-language']]);

Html Form Code

{!! Form::open(['id'=>'editSettings','class'=>'ajax-form','method'=>'PUT']) !!} //Input Elements Goes Here... {!! Form::close() !!} Ajax Call code

$('#save-form').click(function () {
    $.easyAjax({
        url: '{{ route('admin.settings.update', ['1']) }}',
        container: '#editSettings',
        type: "POST",
        redirect: true,
        file: (document.getElementById("logo").files.length != 0 || document.getElementById("login_background").files.length != 0) ? true : false
    })
});

When User Click on the update button the data must be updated, but I got http method not allowed exception in browser's console.

are you passing the CSRF ?

Vidal
– Vidal

2019-06-20 12:36:27 +00:00
Commented Jun 20, 2019 at 12:36 — Vidal
– Vidal, Commented Jun 20, 2019 at 12:36
yes, I am passing CSRF

Hafiz Siddiq
– Hafiz Siddiq

2019-06-20 14:58:53 +00:00
Commented Jun 20, 2019 at 14:58 — Hafiz Siddiq
– Hafiz Siddiq, Commented Jun 20, 2019 at 14:58

Salman Zafar · Accepted Answer · 2019-06-20 13:10:52Z

1

You are posting data. When you post data and use resource in your router laravel calls store function and your route does not let it (['only' => ['edit', 'update', 'index', 'change-language']).

for testing it add store function to your route and dd($request); you can see your request;

edited Jun 20, 2019 at 13:10

Salman Zafar

4,0655 gold badges23 silver badges44 bronze badges

answered Jun 20, 2019 at 12:57

Mohammad Habibinodeh

1864 bronze badges

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

Comments

Adam Rodriguez · Accepted Answer · 2019-06-20 15:13:45Z

You will need to spoof your method from your ajax call, assuming easyAjax allows a data attribute it should include:

data: {
    '_method' : 'PUT'
},

In addition, you will want to include your csrf token:

data: {
    '_method' : 'PUT',
    '_token' : '{{csrf_token()}}'
},

Note: '{{csrf_token()}}' will work as long as the script is part of the blade view. If not, then use a header:

headers: {
    'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
}

If you need to use headers to include your csrf token, make sure to include the meta tag in the head portion of your document:

<meta name="csrf-token" content="{{ csrf_token() }}">

The full solution:

$('#save-form').click(function () {
    $.easyAjax({
        url: '{{ route('admin.settings.update', ['1']) }}',
        container: '#editSettings',
        type: "POST",
        data: {
          '_method' : 'PUT',
          '_token' : '{{csrf_token()}}'
        },
        redirect: true,
        file: (document.getElementById("logo").files.length != 0 || 
        document.getElementById("login_background").files.length != 0) ? true : false
    })
});

Comments

Hafiz Siddiq · Accepted Answer · 2019-06-20 15:37:02Z

Thanks @adam for your answer, this was exactly the problem. Finally I wrote the following code to get the expected result

$('#save-form').click(function () {
        $.easyAjax({
            url: '{{ route('admin.settings.update', ['1']) }}',
            container: '#editSettings',
            type: "POST",
            data: {
                'company_name': $('#company_name').val(),
                'company_email': $('#company_email').val(),
                'company_phone': $('#company_phone').val(),
                'website': $('#website').val(),
                'address': $('#address').val(),
                'currency_id': $('#currency_id').val(),
                'timezone': $('#timezone').val(),
                'locale': $('#locale').val(),
                'latitude': $('#latitude').val(),
                'longitude': $('#longitude').val(),
                '_method' : 'PUT',
                '_token' : '{{csrf_token()}}'
            },
            redirect: true,
            file: (document.getElementById("logo").files.length != 0 || document.getElementById("login_background").files.length != 0) ? true : false
        })
    });

Collectives™ on Stack Overflow

Method Not Allowed Http Exception Ajax Request

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related