Delete event query

Hello, I am working in an app which uses the calendar component. I´ve created a js query which deletes events once an event is selected and the delete key is pressed. The query is successfully triggered but events are not deleted in the calendar component nor in the db table. here is the js query:

let e = event_data.value;
let eventIdToRemove = selectedEventId.value;
let eventIndex = e.findIndex(event => event.eventId === eventIdToRemove);

if(eventIndex !== -1) {
e.splice(eventIndex, 1);
event_data.setValue(e);
} else {
console.error('Event not found');
}
document.addEventListener('keydown', function(event) {
if(event.key === 'Delete') {
removeSelectedEvent();
}
});

And this is the create event js query which works correctly:

let e = event_data.value;
e.push({
title: 'AVAILABLE',
start: calendar1.selectedInterval.start,
end: calendar1.selectedInterval.end,
allDay: calendar1.selectedInterval.allDay,
eventId: 'event_' + calendar1.data.length+1
})
event_data.setValue(e);

How could I make the delete query to delete the events both, in the calendar component and in the db table. Thanks!

Hi @Santiago.zeno,

I think you need to (1) create a query to delete the event from your db and (2) call .trigger() on the query when the event happen, then (3) refetch the data so that the calendar UI will be updated with new events.

I see you have a function removeSelectedEvent. It probably should be triggering the query. If you already do something like I described above, please share the implementation of it so we can take a look

1 Like

Thanks for your reply, it was useful but I have stepped into another problem. Im using a delete query to delete events in the database by using EventID.

This EventID is the primary key of my db table. I have a function that gets the max EventID in my DB table so that when a new event is created, the EventID would be Max EventID +1. Im having trouble referencing this value in my delete query. This is the CreateEventHandler

and this is the event handler that im using to get the EventID of the clicked event

@Santiago.zeno

Im having trouble referencing this value in my delete query. This is the CreateEventHandler

Can you clarify what problem you are facing exactly?

FWIW, I think you shouldn't manage the eventID in the frontend (in this case, on Retool app). You should set up a table with auto-increment event id (or even a random UUID id). Once an event is created, you would refetch the data from the database to get its ID. The database should always be the source of truth.

I followed your advice and set up an auto-increment event id called 'ID'

How do I create a delete query that deletes clicked events?

I see that you have the "ID" returned. That's great. I think you can implement a DeleteEvent that delete it based on ID. If you switch to the "GUI" mode, there is an option to "Delete record"

Or implement it with SQL

DELETE FROM "EventsTable" WHERE id = {{ event.id }};
2 Likes