AUI Select2

Ask a question

Summary

Select2 3.4.5 is a third party replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results. AUI provides a visual wrapper around Select2 to style it according to the Atlassian Design Guidelines (ADG).

Status

API status: general
Web resource key: com.atlassian.auiplugin:aui-select2
AMD Module key: N/A
Experimental API: 5.3
General API: 5.8

Examples

Multi select

Demo code
Result
  • No matches found
AخA
 
<form class="aui">
    <select id="select2-example" multiple>
        <option value="CONF">Confluence</option>
        <option value="JIRA">JIRA</option>
        <option value="BAM">Bamboo</option>
        <option value="JAG">JIRA Agile</option>
        <option value="CAP">JIRA Capture</option>
        <option value="AUI">AUI</option>
    </select>
</form>
 
AJS.$("#select2-example").auiSelect2();

Single select

Demo code
Result
 
<form class="aui">
    <select id="select2-example2">
        <option value="CONF">Confluence</option>
        <option value="JIRA">JIRA</option>
        <option value="BAM">Bamboo</option>
        <option value="JAG">JIRA Agile</option>
        <option value="CAP">JIRA Capture</option>
        <option value="AUI">AUI</option>
    </select>
</form>
 
AJS.$("#select2-example2").auiSelect2();

These docs only show the method to call the ADG-styled Select2. The options passed into the function are the same as the original Select2. You can see the full docs here.