Events
Selectable fires a number of custom events that the instance can listen for.
You can attach a number of custom event listeners using the on()
method and pass the event name and a callback as the first two arguments:
const selectable = new Selectable();
selectable.on('selectable.XXXX', fn);
Event listeners can be detached by calling the off()
method with the same arguments:
selectable.off('selectable.XXXX', fn);
Both the on()
and off()
methods function the same as the native addEventListener
and removeEventListener
methods respectively.
This means that in order to remove a custom event listener from the instance, you must pass the same function expression to the off()
method as you did to the on()
method - declared / anonymous functions cannot be removed.
Incorrect
selectable.on('selectable.end', (e, selected, unselected) => {
counter.innerHTML = selected.length;
});
Correct
const updateCounter = (e, selected, unselected) => {
counter.innerHTML = selected.length;
};
// attach the event listener
selectable.on('selectable.end', updateCounter);
// detach the event listener
selectable.off('selectable.end', updateCounter);
Event reference
- selectable.init
- selectable.start
- selectable.drag
- selectable.end
- selectable.select
- selectable.unselect
- selectable.update
- selectable.recalculate