I managed to solve the issue and just wanted to post the solution here :)
So basically, I used a hidden input field in the delete form. At first I had some issues on how to fill out the value parametar of that hidden input, but then I used .attr('value', calendar.event.id) selector to fill it out.
I also had to add id parameter to my delete route.
I do have one additional question :)
You'll notice that everywhere I'm using the term id, and not event_id.
But my model file, as well as the actual column name in the DB is "event_id" (I know this isn't to Laravel naming standard).
Regardless, the application is able to delete the events - how? Is it Laravel magic, or did I miss anything? The same result is even if I use Route::DELETE('calendar/destroy/{id}' or Route::DELETE('calendar/destroy/{event_id}'
How is that possible?
Anyway, this is what my code looks like now:
Model:
class Event extends Model
{
use HasFactory;
protected $fillable = [
'event_id',
'user_id',
'hospital_id',
'report_id',
'event_date',
'event_content',
'created_by'
];
protected $primaryKey = 'event_id';
protected $table = 'events';
}
Route (web.php):
Route::DELETE('calendar/destroy/{id}',[\App\Http\Controllers\EventsController::class,'destroy'])->name('calendar.destroy');
Controller:
public function destroy(Request $request): \Illuminate\Http\JsonResponse
{
$data = [
'event' => Event::destroy($request->id),
'message_id' => $request->id,
'success' => true,
'message' => 'Event deleted successfully'
];
return response()->json($data);
}
The form:
<form method="POST" action="{{ route('calendar.destroy') }}" class="needs-validation" novalidate=""></p>
@csrf
@method('DELETE')
<input type="hidden" name="id" id="id" value="">
<div class="form-group">
<x-button tabindex="3">
{{ __('Delete event') }}
</x-button>
</div>
</form>
Calendar:
eventClick: function(calendar, jsEvent, view) {
$('#eventDetail').modal("show");
$('#id').html(calendar.event.id).attr('value', calendar.event.id);
$('#title').html(calendar.event.title);
$('#start').html(moment(calendar.event.start).format('DD.MM.YYYY'));
$('#volunteer').html(calendar.event.extendedProps.volunteer);
}
Thank you @vincent15000 for your ideas :)
