# Calendars

* [Bubble.io Plugin](#bubble.io-plugin)
* [JavaScript SDK](#javascript-sdk)

### 🧋Bubble.io Plugin

#### Natively - Calendar

!!! YOU NEED TO SET "CalendarObject (Natively - ... " into element field

<figure><img src="/files/jk6OZcNA1cPOdi9JltLV" alt=""><figcaption></figcaption></figure>

#### Events:

* Get Calendars Success
* Get Calendars Failed
* Create Event Success
* Create Event Failed

#### States:

* Get Calendars Result - list of CalendarObject's
  * CalendarObject:
    * id - unique calendar identifier on these device.
* Create Event Calendar ID - Calendar ID where the new event was created
* Create Event/Get Calendsr Status - Result status after calling **Create Event** or **Get Calendars**
* Event Title - Event title that was created
* Event End Date - Event end date in ISO 8601 format
* Event Start Date - Event start date in ISO 8601 format
* Error - error message is exists. Examples:
  * add\_calendar\_event\_failure -> something went wrong on app side
  * start\_date\_missing
  * end\_date\_missing
  * no\_available\_calendars -> user doesn’t have available calendars
  * cannot\_retrieve\_calendars -> something went wrong on app side
  * calendar\_permission\_missing -> no permission
  * timezone\_missing
* Message **-** message about the current stage of the process if exists

#### Actions:

* Get Calendars - response: list of CalendarsObject's
* Create Event - response: Event Calendar ID, Event Title, Event End Date, Event Start Date
  * Title - **Required**
  * End Date - Required
  * Start Date - Required
  * Timezone - Required. ISO 8601 format
  * Description

### 🛠 JavaScript SDK

```javascript
const calendar = new NativelyCalendar()
const retrieve_calendars_callback = function(resp) {
        console.log(resp.data.id);
        console.log(resp.status);
        console.log(resp.error);
};
const create_calendar_event_callback = function (resp) {
        console.log(reps.status); // "SUCCESS"/"FAILED"
        console.log(resp.data.id); // Calendar ID
        console.log(resp.data.title); // Event title
        console.log(resp.data.end); // Event end date. ISO 8601
        console.log(resp.data.start); // Event start date. ISO 8601
};
const title = "event title"
const endDate = "2025-07-10 15:00:00.000" // ISO 8601
const startDate = "2025-07-10 14:00:00.000" // ISO 8601
const timezone = "Africa/Abidjan" // ISO 8601
const calendarId = "calendar_id"
const description = "Event notes"

calendar.retrieveCalendars(retrieve_calendars_callback);
calendar.createCalendarEvent(
        title,
        endDate,
        startDate,
        timezone,
        calendarId,
        description, 
        create_calendar_event_callback
        );
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.buildnatively.com/guides/integration/calendars.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.