Error "Object does not support property or method 'selectize'" on selectize initialization

Question

i'm triyng to use this code

    $(this.node).find("select").selectize({
    valueField: "value",
    labelField: "label",
    searchField: ["label"],
    maxOptions: 10,
    create: false,
    render: {
        option: function (item, escape) {
            return "<div>" + escape(item.label) + "</div>";
        }
    },
    load: function (query, callback) {
        if (!query.length) return callback();
        $.ajax({
            url: "../ajaxPage.aspx?functionName=GET_03&fieldValue=" + encodeURIComponent(query),
            type: "POST",
            dataType: "json",
            data: {
                maxresults: 10
            },
            error: function () {
                callback();
            },
            success: function (res) {
                console.log(res);
                callback(res);
            }
        });
    }
});

$(this.node).find("select") is a simple select:

<select name="tagName" id="tagId"></select>

I include this js in my page:

microplugin.min.js
sifter.min.js
selectize.js
selectize.default.css

but when i use .selectize i get this error at runtime:

"Object does not support this property or method selectize"

Any idea about this error?

Answer 1

yes... i'm using jQuery. I load dependencies in this order:

microplugin.min.js
sifter.min.js
selectize.js
selectize.default.css

do you think is this the wrong order?

Answer 2

You may have to include the css before all the js files.

selectize.default.css
microplugin.min.js
sifter.min.js
selectize.js