How can I properly delete calendar events using the PhoneGap Calendar plugin?

Question

I am currently using the PhoneGap Calendar plugin in my app an I am able to add events to the device calendar using a REST API call. Now I would like to synchronize reminder data from the web to the device calendar. For testing, I am using the following data in JSON format:

  [ { title: 'Anuj Event',
    location: 'Test',
    notes: 'It is Party Time',
    startDate: new Date(2016,11, 3, 12, 10, 0, 0, 0),
    endDate: new Date(2016, 11, 3, 18, 45, 0, 0, 0),
  },{
        title: 'Rahul Event',
    location: 'Noida',
    notes: 'Work Hard',
    startDate: new Date(2016,11, 2, 12, 10, 0, 0, 0),
    endDate: new Date(2016, 11, 2, 18, 45, 30, 45, 0),
  }]

My UI looks like this:

This whole process works fine, but I am facing two issues:

If someone deletes an event from the web interface, let's say "Anuj Event", then the REST API will only return "Rahul Event', since the other event was deleted, but it will still be in the calendar on the device. How can I determine that there is difference between the two and make sure that "Anuj Event" is deleted when the app synchronizes?
When deleting an event from the calendar all events in a specific date time range are deleted, instead of by title. For example, I have three events in a day, one is in the morning, second is in the evening and the third is at night. If I want to delete the last event then I use the following parameters:

startDate: new Date(2016,11, 1, 15, 32, 10, 50, 0), endDate: new Date(2016, 11, 1, 18, 45, 30, 45, 0)

But that ends up deleting other events as well, how can I solve this?

score 0 · Answer 1 · answered Dec 05 '16 at 14:36

I will start by answering your second question regarding the deletion of events. You are relying on date ranges, when there are several other parameters available when deleting events, as seen in the plugin documentation:

window.plugins.calendar.deleteEvent(newTitle,eventLocation,notes,startDate,endDate,success,error);

As you can see it is possible to pass a title as a parameter, which should only delete the events that match the title, startDate and endDate. It looks like you are using ngCordova, so that would look like this:

$cordovaCalendar.deleteEvent({
  newTitle: 'Anuj Event',
  startDate: new Date(2015, 2, 12, 19, 0, 0, 0, 0),
  endDate: new Date(2015, 2, 12, 22, 30, 0, 0, 0)
}).then(function (result) {
  // success
}, function (err) {
  // error
});

Regarding your question about how to keep the web and device calendar synchronized. I would recommend looking at this question, as it attempts to answer your question in a broader sense. In essence, you have to come up with a strategy to synchronize the data. Specifics about how to implement this are difficult to answer as it would require a deep understanding of how your app works. I would recommend you try a few things out based on the question I mentioned and ask a new question if you run into more specific issues.

How can I properly delete calendar events using the PhoneGap Calendar plugin?

1 Answers1