Skip to content

Commit 7f8e9dc

Browse files
committed
Document the change.select2 event
This closes select2#3620.
1 parent ac10968 commit 7f8e9dc

1 file changed

Lines changed: 30 additions & 1 deletion

File tree

docs/_includes/options/events/jquery.html

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,36 @@ <h3>
1919
What events does Select2 listen for?
2020
</h3>
2121

22-
{% include options/not-written.html %}
22+
<p>
23+
Select2 will listen for the <code>change</code> event on the
24+
<code>&lt;select&gt;</code> that it is attached to. If you make any
25+
external changes that need to be reflected in Select2 (such as changing the
26+
value), you should trigger this event.
27+
</p>
28+
29+
{% highlight js linenos %}
30+
$('select').val('US'); // Select the option with a value of 'US'
31+
$('select').trigger('change'); // Notify any JS components that the value changed
32+
{% endhighlight %}
33+
34+
<h3>
35+
Can I trigger an event other than <code>change</code> to notify Select2 of changes?
36+
</h3>
37+
38+
<p>
39+
It's common for other components to be listening to the <code>change</code>
40+
event, or for custom event handlers to be attached that may have side
41+
effects. Select2 does not have a custom event (like
42+
<code>select2:update</code>) that can be triggered other than
43+
<code>change</code>. You can rely on jQuery's event namespacing to limit
44+
the scope to Select2 though by triggering the <code>change.select2</code>
45+
event.
46+
</p>
47+
48+
{% highlight js linenos %}
49+
$('select').val('US'); // Change the value or make some change to the internal state
50+
$('select').trigger('change.select2'); // Notify only Select2 of changes
51+
{% endhighlight %}
2352

2453
<h3>
2554
What events can be prevented? How can I prevent a selection from being made?

0 commit comments

Comments
 (0)