How to use Select2 with JSON via Ajax request?
Here you have an example
$("#profiles-thread").select2({ minimumInputLength: 2, tags: [], ajax: { url: URL, dataType: 'json', type: "GET", quietMillis: 50, data: function (term) { return { term: term }; }, results: function (data) { return { results: $.map(data, function (item) { return { text: item.completeName, slug: item.slug, id: item.id } }) }; } }});
It's quite easy
for select2 v4.0.0 slightly different
$(".itemSearch").select2({ tags: true, multiple: true, tokenSeparators: [',', ' '], minimumInputLength: 2, minimumResultsForSearch: 10, ajax: { url: URL, dataType: "json", type: "GET", data: function (params) { var queryParameters = { term: params.term } return queryParameters; }, processResults: function (data) { return { results: $.map(data, function (item) { return { text: item.tag_value, id: item.tag_id } }) }; } }});
In Version 4.0.2 slightly different Just in processResults
and in result
:
processResults: function (data) { return { results: $.map(data.items, function (item) { return { text: item.tag_value, id: item.tag_id } }) }; }
You must add data.items
in result
. items
is Json name :
{ "items": [ {"id": 1,"name": "Tetris","full_name": "s9xie/hed"}, {"id": 2,"name": "Tetrisf","full_name": "s9xie/hed"} ]}