Unable to initialise AUI Select2 with typeError: 'apply' of undefined

aui
aui-docs
aui-796
aui-select2
#1

AUI 7.8.x vs AUI 7.9.x

I’m trying to use auiSelect2 to retrieve my data dynamically but when i’m calling auiSelect2()

The console are showing
Uncaught TypeError: Cannot read property ‘apply’ of undefined
at init.d.default.fn.auiSelect2 (com.atlassian.auiplugin:internal-src-js-aui-select2.js?locale=en-SG:4)
at :1:39

Before this the console is already showing that this is failing when trying to init

Example

AJS.toInit(function() {
    AJS.$("#aui-select2").auiSelect2({
        data: loadMyData,
        formatResult: format,
        formatSelection: format
    });
//of course i have 2 of my function here loadMyData and format

});

I realized this only fail in JIRA core 7.12 and above where there is a change in AUI plugin version. I checked the select2.js and did not find any changes or perhaps i missed out some stuff here.

Note: Same code base work in 7.11.x but fail in jira version 7.12.x and above

#2

Hi @ferry,

I’m not sure what’s going wrong here, but perhaps we can figure it out :slight_smile:

How are you including the resources for select2 in to your plugin? Does your plugin declare a dependency on the com.atlassian.auiplugin:aui-select2 web-resource?

Looking at the aui-select2.js file, the first line that the stacktrace could be referring to is this one: https://bitbucket.org/atlassian/aui/src/13501705c1a16b977a35f92f70883377d6efe372/src/js/aui/select2.js?fileviewer=file-view-default#select2.js-44,17. If that were the case, it would mean that the select2 library is getting removed from the window.jQuery.fn object before your code runs.

Could you check whether window.jQuery.fn.select2 is defined before your code runs?

console.debug('select2 before dom ready', window.jQuery.fn.select2);
AJS.toInit(function() {
    console.debug('select2 after dom ready', window.jQuery.fn.select2);
    AJS.$("#aui-select2").auiSelect2({
        data: loadMyData,
        formatResult: format,
        formatSelection: format
    });

Cheers,
Daz

#3

Hi @daz,

Thanks you pointed me to the right direction.

I figured out the culprit. Silly me! I have jQuery.noConflict(true) pasted accidentally into my code and i didnt pick it up. I guess it wiped out all my variable in jQuery… SHRUGS