# Event selecting

![Selection in Air Calendar](https://4058764824-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LKsUC5-RtIwsN11E9Ag%2F-LdjHc6cNe-ZbrB1Whyh%2F-LdjxgYEzawtzXhT5v2f%2Fselecting.gif?alt=media\&token=d954efd7-2683-454a-8959-bd1c39ac0113)

To enable selection check the element property **`Event and days are selectable`** . Once enabled the following states, triggers and actions can be used.

![Enabling selection in Air Calendar](https://4058764824-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LKsUC5-RtIwsN11E9Ag%2F-LdjHc6cNe-ZbrB1Whyh%2F-LdjzJYC1DwJBuos8Fr7%2Fimage.png?alt=media\&token=6ef8201e-c245-40bf-8c77-7041aaf94f15)

{% hint style="danger" %}
When selection is enabled, clicking on a cell triggers the **`selection is made`**  event as well as the **`date clicked`** event. If you don't want your users to click to select but instead click and drag to select, you have to change the element property, **`Select min distance`** to a value greater than 0.
{% endhint %}

![Select min distance property](https://4058764824-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LKsUC5-RtIwsN11E9Ag%2F-LdjHc6cNe-ZbrB1Whyh%2F-Ldk5dSw3LA1nZNsWLZk%2Fimage.png?alt=media\&token=044dbc85-7307-4b00-bf1c-429c419c0537)

## States

{% hint style="info" %}
**`selected start date`** :  The start date/time of the current selection. The value is a `date`.
{% endhint %}

{% hint style="info" %}
**`selected end date`** :  The end date/time of the current selection. The value is a `date`.
{% endhint %}

{% hint style="info" %}
**`selection all day?`** :  This is a boolean (`yes/no`) that tells you if the selection occurred in an All Day (yes) cell or a timed cell (no).&#x20;
{% endhint %}

{% hint style="warning" %}
**`selected cells id attribute`** :  This is the html element ID attribute of the selected region. You can use this as reference to show a context menu.\
\&#xNAN;*NB: This is an advanced property so only use if you understand what you're doing.*
{% endhint %}

## Triggers

{% hint style="info" %}
**`selection is made`** :  Triggered when a selection has been made. Once this event occurs the states defined above are available and can be used in a workflow. For example you may want to show a popup with the selected dates to create an event in your database.
{% endhint %}

## Actions

Air calendar allows allows you to programmatically select or cancel a selection. This is useful if after the user has selected an area decides to change the start or end time (see demo at the start of this page). The following actions are provided.

{% hint style="info" %}
**`Select`**: Selects a period of time  on the calendar. It has following 3 fields
{% endhint %}

**`start date`** - Start date of the selection. Value should be date. \
\&#xNAN;**`end date`** - End of the selection. Optional. Default slot value will be used. Value should be a date.  This value is [*exclusive*](https://seanhoots.gitbook.io/airplugins/air-calendar/exclusive-end-date-allday-events), meaning if you want to your last full-day selection to be Thursday, then specify Friday \
\&#xNAN;**`All day`** - Specify if selection should happen in the All Day slot. Optional. Default is false.

{% hint style="info" %}
**`Unselect`**: Cancels the current selection. It doesn't have any fields.
{% endhint %}
