Select2 simple example not working properly

Hello community

i’m trying to add Select2 to my gadget , i followed this documentation , but still looks like this

option

this is my code :

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/@atlassian/aui@8.5.1/dist/aui/aui-prototyping.css" media="all">
<script src="https://unpkg.com/@atlassian/aui@8.5.1/dist/aui/aui-prototyping.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://connect-cdn.atl-paas.net/all.js"></script>
<script src="//aui-cdn.atlassian.com/aui-adg/5.8.12/js/aui.js" type="text/javascript"></script>
<script type="text/underscore-template" id="dashboardItemConfigTemplate">
    <form class='aui'>
            <select id="select2-example" >
                <option value=""> </option>
                <option value="1">option 1 </option>
                <option value="2">option 2 </option>
                <option value="3">option 3 </option>
            </select>
        </div>
    </form>
</script>
 <script type="text/javascript">
  AJS.$("#select2-example").auiSelect2();
</script>

what i m missing please !
thnak you .

Hi @hamzabouallegue,

When this code AJS.$("#select2-example").auiSelect2(); executes, it expects to find the element in DOM.

From the given code it looks like it only exists as string within text/underscore-template.

Regards,
TJ

1 Like