can't select json-results on select2

Question

having JS like:

$(".select2-input").select2({
        placeholder: placeholder,
        id: function(data){return data.id},
        ajax: {
            url: "/autocomplete",
            datatype: 'json',
            data: function (params) {
                return {
                    q: params.term, // search term
                    page: params.page
                };
            },
            results: function (data) {
                return {
                    results: data.results
                };
            },
            cache: true,
            id: function(connection){
                console.log(connection);
            }
        }
    });

and results from "/autocomplete" URL like this:

{"results":[{"id":14953,"text":"Dohn Doe"},{"id":15467,"text":"Jane Dohe"}]}

With all of this I can see autocomplete results, but clicking on any results causes no changes!

So I've been trying to implement answer from this question, but with no luck. Probably I just missed/messed something.

Also this line

console.log(connection);

writes nothing to console.

Select2 version is 4.0

Answer 1

Ok, seems like I found the problem. First of all need to say, that select2 from version 4.0 does not support id option I've concerned above. This is the extract from documentation to prove it:

Select2 no longer supports a custom id or text to be used, but provides integration points for converting incorrect data to the expected format.

So the problem was not in the code I've provided (except dataType type, thanks Dave Newton!), but in the code I didn't provide. So there I had

input :person, as: :text, input_html: { class: "select2-input", "data-placeholder" => person }

– notice the as: :text part

and once I've changed it to

input :person, as: :select, input_html: { class: "select2-input", "data-placeholder" => person }

everything worked like a charm! Still don't know what drives me to make it text typed instead of select.