# Event Object

> FullCalendar v6 documentation, for an old release. Web version: https://legacy.fullcalendar.io/v6/event-object
>
> Latest version (v7): https://fullcalendar.io/docs/event-object.md

A JavaScript object that FullCalendar uses to store information about a calendar event. It is exposed in various places of the API such as [getEventById](https://legacy.fullcalendar.io/v6/Calendar-getEventById.md) and provides methods for dynamic manipulation. It was originally [parsed from a plain object](https://legacy.fullcalendar.io/v6/event-parsing.md).

```js
var calendar = new Calendar(calendarEl, {
  timeZone: 'UTC',
  events: [
    {
      id: 'a',
      title: 'my event',
      start: '2018-09-01'
    }
  ]
})

var event = calendar.getEventById('a') // an event object!
var start = event.start // a property (a Date object)
console.log(start.toISOString()) // "2018-09-01T00:00:00.000Z"
```

An event object has a number of properties and methods. **All properties are read-only** and you must use the methods to modify the properties. Here is a list of all properties that exist on an event object:

<table>

<tr>
<th>id</th>
<td markdown='1'>
String. A unique identifier of an event. Useful for [getEventById](https://legacy.fullcalendar.io/v6/Calendar-getEventById.md).
</td>
</tr>

<tr>
<th>groupId</th>
<td markdown='1'>
String. Events that share a `groupId` will be dragged and resized together automatically.
</td>
</tr>

<tr>
<th>allDay</th>
<td markdown='1'>
Boolean (`true` or `false`). Determines if the event is shown in the "all-day" section of relevant views. In addition, if `true` the time text is not displayed with the event.
</td>
</tr>

<tr>
<th>start</th>
<td markdown='1'>
[Date object](https://legacy.fullcalendar.io/v6/date-object.md) that obeys the current [timeZone](https://legacy.fullcalendar.io/v6/timeZone.md). When an event begins.
</td>
</tr>

<tr>
<th>end</th>
<td markdown='1'>
[Date object](https://legacy.fullcalendar.io/v6/date-object.md) that obeys the current [timeZone](https://legacy.fullcalendar.io/v6/timeZone.md). When an event ends. It could be `null` if an end wasn't specified.

**Note: This value is exclusive**. For example, an event with the `end` of `2018-09-03` will appear to span through `2018-09-02` but end before the start of `2018-09-03`. See how events are [are parsed from a plain object](https://legacy.fullcalendar.io/v6/event-parsing.md) for further details.

</td>
</tr>

<tr>
<th>startStr</th>
<td>An ISO8601 string representation of the start date. If the event is all-day, there will not be a time part.</td>
</tr>

<tr>
<th>endStr</th>
<td>An ISO8601 string representation of the end date. If the event is all-day, there will not be a time part.</td>
</tr>

<tr>
<th>title</th>
<td markdown='1'>
String. The text that will appear on an event.
</td>
</tr>

<tr>
<th>url</th>
<td markdown='1'>
String. A URL that will be visited when this event is clicked by the user. For more information on controlling this behavior, see the [eventClick](https://legacy.fullcalendar.io/v6/eventClick.md) callback.
</td>
</tr>

<tr>
<th>classNames</th>
<td markdown='1'>
An array of strings like `[ 'myclass1', 'myclass2' ]`. Determines which HTML classNames will be attached to the rendered event.
</td>
</tr>

<tr>
<th>editable</th>
<td markdown='1'>
Boolean (`true` or `false`) or `null`. The value overriding the [editable](https://legacy.fullcalendar.io/v6/editable.md) setting for this specific event.
</td>
</tr>

<tr>
<th>startEditable</th>
<td markdown='1'>
Boolean (`true` or `false`) or `null`. The value overriding the [eventStartEditable](https://legacy.fullcalendar.io/v6/eventStartEditable.md) setting for this specific event.
</td>
</tr>

<tr>
<th>durationEditable</th>
<td markdown='1'>
Boolean (`true` or `false`) or `null`. The value overriding the [eventDurationEditable](https://legacy.fullcalendar.io/v6/eventDurationEditable.md) setting for this specific event.
</td>
</tr>

<tr>
<th>resourceEditable</th>
<td markdown='1'>
Boolean (`true` or `false`) or `null`. The value overriding the [eventResourceEditable](https://legacy.fullcalendar.io/v6/eventResourceEditable.md) setting for this specific event.
</td>
</tr>

<tr>
<th>display</th>
<td markdown='1'>
The rendering type of this event. Can be `'auto'`, `'block'`, `'list-item'`, `'background'`, `'inverse-background'`, or `'none'`. See [eventDisplay](https://legacy.fullcalendar.io/v6/eventDisplay.md).
</td>
</tr>

<tr>
<th>overlap</th>
<td markdown='1'>
The value overriding the [eventOverlap](https://legacy.fullcalendar.io/v6/eventOverlap.md) setting for this specific event. If `false`, prevents this event from being dragged/resized over other events. Also prevents other events from being dragged/resized over this event. Does not accept a function.
</td>
</tr>

<tr>
<th>constraint</th>
<td markdown='1'>
The [eventConstraint](https://legacy.fullcalendar.io/v6/eventConstraint.md) override for this specific event.
</td>
</tr>

<tr>
<th>backgroundColor</th>
<td markdown='1'>
The [eventBackgroundColor](https://legacy.fullcalendar.io/v6/eventBackgroundColor.md) override for this specific event.
</td>
</tr>

<tr>
<th>borderColor</th>
<td markdown='1'>
The [eventBorderColor](https://legacy.fullcalendar.io/v6/eventBorderColor.md) override for this specific event.
</td>
</tr>

<tr>
<th>textColor</th>
<td markdown='1'>
The [eventTextColor](https://legacy.fullcalendar.io/v6/eventTextColor.md) override for this specific event.
</td>
</tr>

<tr>
<th>extendedProps</th>
<td markdown='1'>
A plain object holding miscellaneous other properties specified during parsing. Receives properties in the explicitly given `extendedProps` hash as well as other non-standard properties.
</td>
</tr>

<tr>
<th>source</th>
<td markdown='1'>
A reference to the [Event Source](https://legacy.fullcalendar.io/v6/event-source-object.md) this event came from. If the event was added dynamically via [addEvent](https://legacy.fullcalendar.io/v6/Calendar-addEvent.md), and the `source` parameter was not specified, this value will be `null`.
</td>
</tr>

</table>

All properties are read-only. If you want to modify them, use the various methods of the Event object, such as [setProp](https://legacy.fullcalendar.io/v6/Event-setProp.md), [setExtendedProp](https://legacy.fullcalendar.io/v6/Event-setExtendedProp.md), [setDates](https://legacy.fullcalendar.io/v6/Event-setDates.md), etc.

The expected values for `allDay`, `start` and `end` have been discussed in detail on the subject of [parsing events](https://legacy.fullcalendar.io/v6/event-parsing.md). It is vital to understand how the `end` date is **exclusive** throughout the FullCalendar API.


## Non-standard Fields

In addition to the fields above, you may also include your own non-standard fields in each Event object. FullCalendar will not modify or delete these fields. For example, developers often include a `description` field for use in callbacks like [event render hooks](https://legacy.fullcalendar.io/v6/event-render-hooks.md). Any non-standard properites are moved into the `extendedProps` hash during [event parsing](https://legacy.fullcalendar.io/v6/event-parsing.md).

```js
var calendar = new Calendar(calendarEl, {
  events: [
    {
      title: 'BCH237',
      start: '2019-08-12T10:30:00',
      end: '2019-08-12T11:30:00',
      extendedProps: {
        department: 'BioChemistry'
      },
      description: 'Lecture'
    }
    // more events ...
  ],
  eventDidMount: function(info) {
    console.log(info.event.extendedProps);
    // {description: "Lecture", department: "BioChemistry"}
  }

});
```