diff --git a/docs/_includes/options/events/jquery.html b/docs/_includes/options/events/jquery.html index 8023909f..319f1890 100644 --- a/docs/_includes/options/events/jquery.html +++ b/docs/_includes/options/events/jquery.html @@ -7,7 +7,38 @@ What events will Select2 trigger? - {% include options/not-written.html %} +

+ Select2 will trigger a few different events when different actions are taken using the component, allowing you to add custom hooks and perform actions. +

+ +
+
change
+
Triggered whenever an option is selected or removed.
+ +
select2:close
+
Triggered whenever the dropdown is closed.
+ +
select2:closing
+
Triggered before the dropdown is closed. This event can be prevented.
+ +
select2:open
+
Triggered whenever the dropdown is opened.
+ +
select2:opening
+
Triggered before the dropdown is opened. This event can be prevented.
+ +
select2:select
+
Triggered whenever a result is selected.
+ +
select2:selecting
+
Triggered before a result is selected. This event can be prevented.
+ +
select2:unselect
+
Triggered whenever a selection is removed.
+ +
select2:unselecting
+
Triggered before a selection is removed. This event can be prevented.
+

How can I attach listeners for these events? diff --git a/docs/_sass/_dl-panels.scss b/docs/_sass/_dl-panels.scss new file mode 100644 index 00000000..76d5151f --- /dev/null +++ b/docs/_sass/_dl-panels.scss @@ -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; + } +} \ No newline at end of file diff --git a/docs/css/s2-docs.scss b/docs/css/s2-docs.scss index 7fe35124..6b66a37c 100644 --- a/docs/css/s2-docs.scss +++ b/docs/css/s2-docs.scss @@ -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"; \ No newline at end of file