Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I disable automatic filtering in selectize.js? Built-in / plugin / modilfy source?

I have a selectize.js drop-down, which loads a list of items from the server using ajax. The server provides an autocomplete from the given string, so I don't need selectize's native filtering. Besides, I really need to turn it off: The server output may be totally different from selectize's one.

The data is fed into JavaScript objects fine, but selectize doesn't even show a popup, since those items doesn't match selectize's filter. How can I disable or modify native filtering and the matches highlighting algorithm? Either with a built-in option, or with a plugin? Or is the only way to go to modify the source?

EDIT:

searchField: false / function() doesn't work (and documentation doesn't mention them as available option values)

EDIT2:

Eventually came up with this trick: Add a fake field to each item, assign a search string to it and tell selectize to use is as a searchField. But obviously, there should a better way, so the question is still open.

like image 759
Yuriy Dyachkov Avatar asked Sep 03 '15 14:09

Yuriy Dyachkov


People also ask

How do I remove Selectize?

Remove the option select[0]. selectize. removeItem(selectedValue); select[0].

What is selectize js?

Selectize is the hybrid of a textbox and <select> box. It's jQuery-based and it's useful for tagging, contact lists, country selectors, and so on. npm install @selectize/selectize.

How do you use Selectize?

The selectize function accepts a callback function which contains the parameters you want Selectize to use to style what is displayed to the user as they fill in the form, as well as what gets submitted through to you. The various key:value pairs inside of the callback function are parameters defined by Selectize.


2 Answers

I use this solution (if results from server is ordered correctly):

    score: function() { return function() { return 1; }; },

or this (if need order)

    score: function(search) {
        var score = this.getScoreFunction(search);
        return function(item) {
            return 1 + score(item);
        };
    },

Sifter uses the score function to filter. Result of score must be > 0.

like image 148
Sergey Ryabov Avatar answered Oct 17 '22 10:10

Sergey Ryabov


I solved with onInitialize method in selectize parameters:

$("select").selectize({
        onInitialize: function() {
             this.$control_input.attr('readonly', true);
        }
});
like image 3
Juan Aguillón Avatar answered Oct 17 '22 11:10

Juan Aguillón