What data structure is select2 expecting from the server and how should it be handled? - jquery-select2-4

Question

What data structure is select2 (v4.0.3) expecting from the server and how should it be handled?
The question is asked on the official FAQ here, but there is no answer.
I have tried several variations of data structure, but based on this tutorial and this jsFiddle, have assumed what should be returned from the server is a list/array of objects/dicts, eg:
matches = [{"id":"1", "tag":"Python"},{"id":"2", "tag":"Javascript"},{"id":"3", "tag":"MongoDB"}]
I have tried this format with the following Javascript:
$("#my_select").select2({
ajax: {
url: "/tag_search",
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term // search term
};
},
processResults: function (data) {
return {
results: data.matches
};
},
cache: true
},
minimumInputLength: 2,
tags: true,
tokenSeparators: [",", " "],
maximumSelectionLength: 5
});
Firebug results for search on Py:
The search area just displays this:
I am expecting all matches to be showing in the dropdown below the search area.

Answer 1

Solution that worked for me:
Rename json key (it has to be text), so server response is:
[{"text": "Python", "id": 1}]
(after coming across this document).
I also just returned the list itself from the server, rather than making the list a dict value.
Javascript
$("#my_select").select2({
ajax: {
url: "/tag_search",
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term // search term
};
},
processResults: function (data) {
return {
results: data
};
},
cache: true
},
minimumInputLength: 2,
tags: true,
tokenSeparators: [",", " "],
maximumSelectionLength: 5
});