events.md

Events

Back to documentation index

Selectic component emits some events that can be caught by the parent.

• input
• change
• item:click
• open
• focus
• close
• blur

input

An event input is emitted each time user select another option.

This event is emitted even if the list doesn't close (like in multiple mode).

Any changes on value will also trigger this event.

2 arguments are sent with the event:

• The selection which is the id of the selected option or an array of id in multiple mode.
• Information about the event. This is an EventChangeOptions object. It includes the isExcluded information ((read more about isExcluded flag)).

change

An event change is emitted when list is closing and selection has changed.

If changes are done on value and selectic is closed, the event will also be emited.

2 arguments are sent with the event:

• The selection which is the id of the selected option or an array of id in multiple mode.
• Information about the event. This is an EventChangeOptions object. It includes the isExcluded information ((read more about isExcluded flag)).

item:click

An event item:click is emitted when user click on a selected item in multiple mode (which are displayed in the main input).

2 arguments are sent with the event:

• The id of the selected item.
• Information about the event. This is an EventOptions object.

open

An event open is emitted when list is opening.

1 argument is sent with the event:

• Information about the event. This is an EventOptions object.

focus

Is an alias of the open event.

close

An event close is emitted when list is closing.

1 argument is sent with the event:

• Information about the event. This is an EventOptions object.

blur

Is an alias of the close event.

Types

EventType

This is a string of an event that can be triggered by Selectic.

Its value can be 'input' | 'change' | 'open' | 'close' | 'focus' | 'blur' | 'item:click'

EventOptions

This is an object with the following arguments:

• eventType (EventType): The type of the triggered event.

• instance (Selectic): A reference to the Selectic instance which had triggered the event.

• automatic (boolean): It is worth true When the event is automatically triggered by Selectic (for example like when value is automatically selected at start).

EventChangeOptions

This is an object with the same argument as EventOptions and the following arguments:

• isExcluded (boolean): The current state of selectionIsExcluded which can be true in dynamic and multiple mode if allowRevert is set to true (read more about dynamic mode).