I'm working with select2 and I have a input field where I want to providde search terms.

As you can see I have a dropdown where I can select or type my own text.
My jquery code:

function createQuestionTags(data){
  $(".question").select2({
    createSearchChoice: function (term, data) {
        if ($(data).filter(function () {
            return this.text.localeCompare(term) === 0;
        }).length === 0) {
            return {
                id: term,
                text: term
            };
        }
    },
    data: data,
    placeholder: "Enter Question",
    allowClear:true
  });
}

How can I set that it is just an input field where you can type and not with a dropdownlist?

I'm working with select2 and I have a input field where I want to providde search terms.

As you can see I have a dropdown where I can select or type my own text.
My jquery code:

function createQuestionTags(data){
  $(".question").select2({
    createSearchChoice: function (term, data) {
        if ($(data).filter(function () {
            return this.text.localeCompare(term) === 0;
        }).length === 0) {
            return {
                id: term,
                text: term
            };
        }
    },
    data: data,
    placeholder: "Enter Question",
    allowClear:true
  });
}

How can I set that it is just an input field where you can type and not with a dropdownlist?

• javascript
• jquery
• jquery-select2

• mak use of autoplete extender.... – The Hungry Dictator Commented Nov 22, 2013 at 10:53
• .select2-results{ display:none; } in CSS ??? – A. Wolff Commented Nov 22, 2013 at 10:55
• When I add the css he logically shows no results ... – nielsv Commented Nov 22, 2013 at 10:56
• FYI: github./select2/select2/issues/1345 – T.J. Crowder Commented Jul 14, 2015 at 13:52

1 Answer 1

A dropdown will always be visible because that's how Select2 works. It's a really good library but this happens to be one of the constraints you will have to work through. The very simple reason behind is:

Select2 is a jQuery based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results. — Select2

You can try and forcefully hide it using CSS but I haven't tried that.

I recently came across selectize.js which is equally good as Select2 and fulfils your requirements.