Select2: How to allow user to select from a default list but accept a new string?

Question

I've this need, and I'm not able to accomplish it using Select2.

User must choose a name from a list. This list is a well-defined list of strings. So I think to pass this list as 'data' to Select2.

If user wants, he can choose a new name, and it must be accepted without problem, without saying and asking nothing to user.

So I tried to use an INPUT as element, using data: to feed default list, and to user createSearchChoice to return a new object with id: term, text: term

But I got

query function not defined for Select2 OrdiniCaricati_Nome_Cliente

What's the right combination on properties / element / functions to use?

Answer 1

A similar question can be found over here: Select2 dropdown but allow new values bu user?

Here is a working JSFiddle I found between the answers: http://jsfiddle.net/pHSdP/2/

HTML

<input type='hidden' id='tags' style='width:300px'/>

JQuery

$("#tags").select2({
createSearchChoice:function(term, data) { if ($(data).filter(function() { return this.text.localeCompare(term)===0; }).length===0) {return {id:term, text:term};} },
multiple: false,
data: [{id: 0, text: 'story'},{id: 1, text: 'bug'},{id: 2, text: 'task'}]
});