Feb 4, 17 / Pis 07, 01 16:19 UTC

Forum - "select2 is not a function"  

The following line of code throw an exception in the source code of the forum: $('#id_sorting, #id_contest__in, #id_status__in, #id_status, #id_contest').select2();

Uncaught TypeError: $(...).select2 is not a function

The selector seems wrong, it returns an empty array. This exception could lead to other features not working properly.

Feb 5, 17 / Pis 08, 01 02:09 UTC

And how do you produce this error, precisely?

As it suggests, your code is malformed and .select2 isn't a valid function in this scope

Feb 5, 17 / Pis 08, 01 04:24 UTC

javascript? how is select2 defined? all the elements id selected do what

Feb 5, 17 / Pis 08, 01 10:56 UTC

@EyeR Well, I don't have to do anything in particular actually. I've got this Exception on every page, it just throw the error in the browser console.

Only officials can fix this. It has to to with inputs on the forum. See https://select2.github.io/

Select2 gives you a customizable select box with support for searching, tagging, remote data sets, infinite scrolling, and many other highly used options.

This error basically can break some features on the website, that's all I know.

Feb 5, 17 / Pis 08, 01 14:24 UTC

In theory it can only break any "feature" that relies upon, which without direct evidence of things not working, I'd suggest is nothing - I probably don't see this error as I don't tend to execute needless scripts, it helps keep things secure, not executing random third party code and a few hundred tabs in the browser is still responsive.

To assume we're running on the same copy that's current on the github link provided, and further assuming it's implimented correctly(probably not, based on previous examples) then the error is in their code(although, no-one else seems to of lodged an error report, and it strikes me as a lot should be afflicted).

Does every page that spawns this error actually load in the script, first?

I'm not sure about "selector seems wrong" - the error is definitely it doesn't know what ".select2" is in terms of a valid function in this scope. Suggests to me either a lack of or a malformed declaration somewhere.

Feb 5, 17 / Pis 08, 01 15:18 UTC

The select2 is definitely defined. But it tries to apply it on an empty array, which produces the error. Looking at the source code, I could see multiple usage of select2(), and none broke but this one. I believe the selector is wrong, returns an empty object and the function fails.

Also, it's definitely in the code of the forum, not from one of my own plugins. And it doesn't seem to affect the usability of the website, but, as I said, it probably breaks a few features since it is a non catched exception and therefore all source code in the same block of code defined after this exception won't be executed at all, if it behaves as I think it does.

Feb 5, 17 / Pis 08, 01 21:06 UTC

Reasonable expectation of behavour.

Granted I'm not overly hot with JS but to me the error suggests the issues is with ".select2" as a function - not arguments passed to. I'd expect a different error to an empty array, like Uncaught TypeError: Cannot set property '.select2' of null or similar.

At a casual guess I'd suggest it's what provides for things like scrolling through the list of flag submissions and autoloading the next lot to provide for "infinite scrolling". I can't really envision much use elsewhere. Certainly don't understand why you'd get the error on every page.

  Updated  on Feb 5, 17 / Pis 08, 01 21:16 UTC, Total number of edits: 1 time
Reason: Additional data

Feb 5, 17 / Pis 08, 01 21:39 UTC

Well, if you open the browser console you should see it (hit F12, then "console" tab). It appears everywhere because the script is loaded on every page.

Maybe select2 modify the prototype of an element retrieved using jQuery? I don't know for sure, but prototype changes are common in JS, therefore expecting a select2 function to be bind to an element is possible. But not if that element is not a valid element, like an array. (just guessing here, doesn't really matter)

Feb 6, 17 / Pis 09, 01 00:17 UTC

Yeah.... I hit F12 I get Yakuake. Everyone needs some dropdown multi-pane/multi-tab terminal emulator.

But opening the panel you suggest in my browser still doesn't display for me such. But there again I don't just allow anything to execute. In fact I allow nothing to execute, without good cause. Especially in a browser.

I've attempted to open in other browsers(actually an IDE, but meh) and managed to obtain the same precise error(line 424) - looking at the other usage of ".select2" in that file (https://asgardia.space/assets/js/front.4334921a5ce5.js - which doesn't match any of the native files in select2.github.io, suggesting made or edited by "staff") then

$('#idsorting, #idcontestin, #idstatusin, #idstatus, #id_contest').select2();

is of visually different syntax to, say,

    $('#id_gender').select2({
        width: 'resolve',
        minimumResultsForSearch: -1
    });

and

    $('.profile-better-select,.better-select').select2({
        width: 'resolve'
    });

or

    /*$('#id_country_of_residence').select2({
        width: 'resolve'
    });*/

Suggesting accurate syntax should of been: $('#idsorting, #idcontestin, #idstatusin, #idstatus, #id_contest').select2({}); and there should possibly be something specified in them curly brackets, too. But as previously mentioned - it's not as if I've a clue what I'm doing with JS.

Feb 6, 17 / Pis 09, 01 16:57 UTC

sorry 4 not get it..r u switch from bs 3.3.7 to select2 or hybrid these 2? didn't c script's src hav select2, agree with eyer seems syntax missing

  Last edited by:  Jason Rainbow (Global Admin, Global Mod, Asgardian)  on Feb 6, 17 / Pis 09, 01 19:50 UTC, Total number of edits: 2 times

Feb 6, 17 / Pis 09, 01 19:48 UTC

sorry 4 not get it..r u switch from bs 3.3.7 to select2 or hybrid these 2? didn't c script's src hav select2, agree with eyer seems syntax missing - bHvTio-20001

[MOD] Hello, please write in a proper English as not everybody understands English correctly and many people rely on the use of third-party software. I tried to read your sentence several time and couldn't totally make sense of it. Could you please edit and correct it? Thanks.

Feb 6, 17 / Pis 09, 01 20:54 UTC

I'd personally read it to read: Sorry for not get it.. are you switch from base 3.3.7 to select2 or hybrid these two? Didn't see script's source have select2, agree with eyer seems syntax missing.

Casually reviewing the error I'd encountered things like running multiple versions can lead to failure in understanding which version to load, but had discounted this due to other previous invocations of .select2 working fine. I had also noticed a lack of importing select2 - But I don't entirely speak JS so assumed it was called into scope elsewhere.

Feb 7, 17 / Pis 10, 01 05:19 UTC

nice of you, bro.
sorry for just having a sloppy glance of the js and reply, i just saw jquery + bootstrap there. if select2 is included, error or console error would mostly be like 'The select2(\'' + options + '\') method was called on an ' + 'element that is not using Select2.' or 'Invalid arguments for Select2: ' or some other stated in select2.js
this is some new tech which is able to call some function without defining or importing it? heartedly like to know.btw, css or scss can do the trick also, set width:auto ; height:auto; position:absolute; set top, left, right, bottom to some value, it adapts to its parent element 2

  Last edited by:  Ezra Lew (Asgardian)  on Feb 7, 17 / Pis 10, 01 05:24 UTC, Total number of edits: 1 time