Delete Data via Modal using External API
You can easily add the functionality to create, edit, update and delete (CRUD operations) via Modal Popup on any data coming from 3rd party Data Source such as Google Sheet, Airtable, External APIs, Supabase, Firebase etc, without storing or persisting of data at the DrapCode database.
How to Delete Data via Modal Using External API without Persisting Data?
Below are steps that shows how to delete data via modal:
1. Create a REST API - DELETE
Go to External API page and create a REST API. Name the API, add the External API URL and select DELETE as call action.
2. Add Request Headers
Go to Headers tab and add request headers as shown below in the image.
3. Send Request & Receive Data
Scroll down and select the radio button, "Non Persistent Collection". Click the Send Request button. As you click the button, data will get recieved. Click the Save Settings button.
4. Create Required Events
Create event to Send Data to External API using REST API for DELETE call action. Also, tick the checkboxes to save response in session and save form data in session.
Then, add show alert message event and page reload event to it.
5. Drop a Button in the Modal
Drag and drop a button in the modal and change its default text to "Delete". For reference, check out Update Data via Modal Using External API
6. Bind REST API for Delete Action
Open the settings of the button and bind the REST API for Delete Action event.
7. Preview/Publish
Open the page containing the data table in the preview or publish mode. For reference, check out Update Data via Modal Using External API
Now click on the Update Modal button and it will open the data entry that you want to delete.
8. Click the Delete Button
As the modal open, click on the Delete button and entry will get deleted automatically.
As the page gets reloaded, the deleted data won't appear in the data table as well as in the collection.
