Laravel: MethodNotAllowedHttpException error with no message after AJAX call to resource controller

Question

I'm updating the value of some models in a database but when I hit submit I get the following error:

"message: "", exception: "Symfony\Component\HttpKernel\Exception\MethodNotAllowedHttpException", file: "C:\xampp\htdocs\Restaurante1\vendor\laravel\framework\src\Illuminate\Routing\RouteCollection.php", line: 255"

This is my JQuery code:

var formData = new FormData();
            formData.append('id', $(this).attr("data-id"));
            formData.append('first', $('#schedules_morning').val());
            formData.append('second', $('#schedules_night').val());
            
            $.ajax({
            

                
                async: true,
                cache: false,
                url: '/schedules',
                type: 'PUT',
                data: 
                {
                formData
                },
                dataType: 'JSON',
                processData: false,
                contentType: false,
            
                success: function (data) { 
                    $('.form_valid_container').fadeIn().html('<span class="form_valid_text">✓ '+ data.success +'</span>');
                    form.trigger("reset");
                    console.log(data.success);
                },
            
                error: function (data){
                    var errors = data.responseJSON;
                    console.log(errors);
                
                    $.each(errors , function(){
                        $('.form_error_container').fadeIn().html('<span class="form_error_text">✘ '+ errors.message +'</span>')
                    }); 
                }
                
                
            });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

I'm sending the request to a resource controller route:

Route::resource('/schedules','ScheduleController');

public function update(Request $request)
    {
        $schedule = Schedule::findOrFail($id);
        $schedule->morning = $request->morning;
        $schedule->night = $request->night;
        $schedule->save();
        
        return response()->json([
        
            'schedule' => $schedule,
            'success' => 'Horario actualizado correctamente',
        ]);
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

PHP (Laravel) Just trick up PUT and DELETE request so with all put request in laravel they put a hidden variable called _method with value put and laravel validated that method agains the post request. So replace your code like below and it should work.

var formData = new FormData();
        formData.append('id', $(this).attr("data-id"));
        formData.append('first', $('#schedules_morning').val());
        formData.append('second', $('#schedules_night').val());
        formData.append('_method', 'put');

        $.ajax({



            async: true,
            cache: false,
            url: '/schedules',
            type: 'POST',
            data: 
            {
            formData
            },
            dataType: 'JSON',
            processData: false,
            contentType: false,

            success: function (data) { 
                $('.form_valid_container').fadeIn().html('<span class="form_valid_text">✓ '+ data.success +'</span>');
                form.trigger("reset");
                console.log(data.success);
            },

            error: function (data){
                var errors = data.responseJSON;
                console.log(errors);

                $.each(errors , function(){
                    $('.form_error_container').fadeIn().html('<span class="form_error_text">✘ '+ errors.message +'</span>')
                }); 
            }


        });