1
0
mirror of synced 2025-02-09 16:49:24 +03:00

Document DOM events

This closes https://github.com/select2/select2/pull/4115.
This commit is contained in:
Kevin Brown 2016-02-14 16:14:58 -05:00
parent 7f8e9dc62a
commit 37dbe059fc
3 changed files with 59 additions and 1 deletions

View File

@ -7,7 +7,38 @@
What events will Select2 trigger?
</h3>
{% include options/not-written.html %}
<p>
Select2 will trigger a few different events when different actions are taken using the component, allowing you to add custom hooks and perform actions.
</p>
<dl class="s2-docs-panels">
<dt>change</dt>
<dd>Triggered whenever an option is selected or removed.</dd>
<dt>select2:close</dt>
<dd>Triggered whenever the dropdown is closed.</dd>
<dt>select2:closing</dt>
<dd>Triggered before the dropdown is closed. This event can be prevented.</dd>
<dt>select2:open</dt>
<dd>Triggered whenever the dropdown is opened.</dd>
<dt>select2:opening</dt>
<dd>Triggered before the dropdown is opened. This event can be prevented.</dd>
<dt>select2:select</dt>
<dd>Triggered whenever a result is selected.</dd>
<dt>select2:selecting</dt>
<dd>Triggered before a result is selected. This event can be prevented.</dd>
<dt>select2:unselect</dt>
<dd>Triggered whenever a selection is removed.</dd>
<dt>select2:unselecting</dt>
<dd>Triggered before a selection is removed. This event can be prevented.</dd>
</dl>
<h3>
How can I attach listeners for these events?

View File

@ -0,0 +1,24 @@
.s2-docs-panels {
dt, dd {
border: 1px solid $panel-default-border;
}
dt {
background-color: $panel-default-heading-bg;
border-top-left-radius: $panel-border-radius;
border-top-right-radius: $panel-border-radius;
padding: 5px 7.5px;
}
dd {
background-color: $panel-bg;
border-bottom-left-radius: $panel-border-radius;
border-bottom-right-radius: $panel-border-radius;
margin-bottom: 0.75em;
padding: 7.5px;
}
dt + dd {
border-top: none;
}
}

View File

@ -1,6 +1,8 @@
---
---
@import "vendor/bootstrap/variables";
@import "result-repository";
@import "sidenav";
@import "hamburger";
@ -19,3 +21,4 @@
@import "prettify";
@import "syntax-highlighting";
@import "typography";
@import "dl-panels";