selectize.js - how can reference some property of the select element during load()?

Question

I'm using selectize.js:

• I have a number of similar select boxes
• Options are loaded dynamically from the server, during load()
• The query made during .load() is unique to each select box. Eg, I'd like to have a .load() hit a different URL based on some property of the select box (eg, data-someproperty).

How can I do that? Code right now is almost identical to the Remote Source example from the Selectize docs.

$('.select-repo').selectize({
    valueField: 'url',
    labelField: 'name',
    searchField: 'name',
    create: false,
    ...
    load: function(query, callback) {
        if (!query.length) return callback();
        $.ajax({
            url: 'https://api.github.com/legacy/repos/search/' + encodeURIComponent(query),
            type: 'GET',
            error: function() {
                callback();
            },
            success: function(res) {
                callback(res.repositories.slice(0, 10));
            }
        });
    }
});

I tried checking out this during .load() but I can't see any reference to the original element.

Answer 1

Found it:

Inside load(), access:

this.$input

To get a JQuery selection with the <select> element.

this.$input.data('whatever')

Would return data-whatever from the select