Ismail H
Ismail H

Reputation: 4499

jquery select2 plugin how to match only beginning of word

I am using select2 in my website and i want the autocomplete to match only the beginning of the word. For example, if I type "CA" I want CAmeroun to appear and not "vatiCAn".

Upvotes: 1

Views: 2080

Answers (2)

Nurhun
Nurhun

Reputation: 691

Inspired by @IsmailH answer. I've merged this code as matchCustom in the provided example, here.

And here's my modification,

            function matchCustom(params, data) {
                // If there are no search terms, return all of the data
                if ($.trim(params.term) === '') {
                    return data;
                }

                // `params.term` should be the term that is used for searching
                // `data.text` is the text that is displayed for the data object
                if (data.text.toUpperCase().indexOf(params.term.toUpperCase()) == 0) {
                    var modifiedData = $.extend({}, data, true);

                    // You can return modified objects from here
                    // This includes matching the `children` how you want in nested data sets
                    return modifiedData;
                }

                // Return `null` if the term should not be displayed
                return null;
            };

Upvotes: 0

Ismail H
Ismail H

Reputation: 4499

I figured out how to resolve this by searching in the documentation (here https://github.com/select2/select2/issues/428).

In select2 library, replace in select2.js :

matcher: function(term, text) {
        return stripDiacritics(''+text).toUpperCase().indexOf(stripDiacritics(''+term).toUpperCase()) >= 0;
    },

by :

matcher: function(term, text) {
       if (text.toUpperCase().indexOf(term.toUpperCase()) == 0) {
        return true;
      }
    },

And tadaaa. It works. I hope someone who is better in JS (99% of JS developers) could give a better answer or create a good patch.

Don't forget to minify your JS ;) !

Upvotes: 2

Related Questions