Simple example of AUI-Select2

Eimear Larkin April 17, 2018

Hi All,

Would anyone have a simple working example of aui-select2?

I've tried loads of different ways but it keeps showing a normal multi-select when loaded. Am trying to get it working in a plugin for validators.

Current situation:

atlassian-plugin.xml:

 <web-resource key="validators-resources" name="validators Web Resources">
<dependency>com.atlassian.auiplugin:ajs</dependency>
<resource type="download" name="validators.css" location="/css/validators.css"/>
<resource type="download" name="validators.js" location="/js/validators.js"/>
<resource type="download" name="images/" location="/images"/>
<context>validators</context>
</web-resource>
<web-resource key="my-resources" name="My Resources">
<dependency>com.atlassian.auiplugin:aui-select2</dependency>
</web-resource>

 validators.js:

AJS.$("#select2-example").select2();

 edit.vm:

<head>
<link rel="stylesheet" href="//aui-cdn.atlassian.com/aui-adg/6.0.7/css/aui-experimental.min.css" media="all">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="//aui-cdn.atlassian.com/aui-adg/6.0.7/js/aui.min.js"></script>
<script src="//aui-cdn.atlassian.com/aui-adg/6.0.7/js/aui-experimental.min.js"></script>
<script src="//aui-cdn.atlassian.com/aui-adg/6.0.7/js/aui-datepicker.min.js"></script>
<script src="//aui-cdn.atlassian.com/aui-adg/6.0.7/js/aui-soy.min.js"></script>
$webResourceManager.requireResource("com.mds.jira.plugin.workflow.validator.user:my-resources")
</head>
<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>

But it still loads like this:

aui-select2.png

Any help would be much appreciated :)

Thanks,

Eimear 

2 answers

1 vote
Tamar October 2, 2022

Hi

 

I faced same issue.

Did you find any solution?

1 vote
Den R September 7, 2018

https://docs.atlassian.com/aui/5.6.8/docs/auiselect2.html

 

AJS.$("#select2-example").auiSelect2();

Suggest an answer

Log in or Sign up to answer