I am making an app with fullcalendar.io and I need to delete an appointment in the table. I am using Laravel 8. I am using ajax to communicate with the server but it shows me error 500 when I invoke the delete method

My controller:

public function destroy(Cita $cita_id)
{
    $cita = Cita::find($cita_id);
    
    $cita->delete();
    
    return back()->with('succes', 'Cita eliminada correctamente');

}

My Route:

Route::delete('/citas/delete/{cita}', [App\Http\Controllers\CitaController::class, 'destroy'])->name('citas.delete');

The console gives me this:

jquery-3.4.1.js:9837 DELETE http://agenda.devetapia.cl/citas/delete/1 500 (Internal Server Error)
send @ jquery-3.4.1.js:9837
ajax @ jquery-3.4.1.js:9434
(anonymous) @ agenda.js:207
dispatch @ jquery-3.4.1.js:5237
elemData.handle @ jquery-3.4.1.js:5044

My javascript

            $('#btnEliminar').click(function(){
              
              if (!confirm("Está seguro de eliminar la cita?")) {
         
              }
              else{ // eliminar

                let urldelete = "http://agenda.devetapia.cl/citas/delete/" id;
                $.ajaxSetup({
                  headers: {
                          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                      }
                  });
            
                $.ajax({
                  type: "DELETE",
                  url : urldelete,
               
                  success: function (data) {
                      console.log("exito")
                  },
                  error: function (data) {
                      console.log('Error:', data);
                  }
                  
                });
              
              }

I haven't been able to determine what I'm doing wrong.

CodePudding user response：

On your controller, can you try removing the:

return back()->with('succes', 'Cita eliminada correctamente');

Rather try changing it with:

return response()->json(['status' => 'success']);

Then on your ajax call, try putting this:

success: function (data) {
  if (data.status == 'success'){
     location.reload();
  }
};

The page should refresh.

You can just try changing the location.reload() code based on the routine that you wanted.