CODEWITHSUNDEEP
selectize.js
Carlo
Carlo

Reputation: 4158

Add options to multiple Selectize inputs on type

I'm loading several Selectize select inputs in one page, like this:

var selectizeInput = [];
$('.select-photo-id').each(function (i) {
    var selectedValue = $(this).val();
    selectizeInput[i + 1] = $(this).selectize({
        'maxOptions': 100,
        'items': [selectedValue],
        'onType': function (input) {
            $.post("admin/ajax/search_photos_for_postcards",
                {input: input},
                function (data) {
                    $(this).addOption(data);
                    $(this).refreshOptions();
                }, 'json');
        }
    });

});

The event onType makes a function call that returns a list of new options which I want to make available right away in the Selectize input. Is there any way to call the Selectize instance from there? As you can see from the code, I tried accessing it with $(this), but it fails. I also tried with $(this).selectize, but it's the same. Which is the correct way to do it?

Upvotes: 1

Views: 2427

Answers (2)

matpie
matpie

Reputation: 17522

You probably want to use the load event provided by the Selectize.js API as seen in the demos. Scroll until you find "Remote Source — Github" and then click "Show Code" underneath it.

Upvotes: 0

Carlo
Carlo

Reputation: 4158

I managed to fix it:

   'onType': function (input) {
        var $this = $(this);
        $.post("admin/ajax/search_photos_for_postcards",
            {input: input},
            function (data) {
                $this[0].addOption(data);
                $this[0].refreshOptions();
            }, 'json');
    }

Upvotes: 0

Related Questions