Select2 with Ajax is not sending request

Question

I'm using Select2 version 4.0.0 and trying to load a remote JSON from a PHP script that returns the already formated data that I need. The problem is that the forces of the darkness are making something, because I just can't send the request, there is no error, but there is no request sent, it just stays so quiet as a devil that I'm almost crying!

I'm using LiveScript and Jade as alternatives to JavaScript and HTML, but I'll translate'em here.

First, my markup defines the selectable field:

<select id="satan-hates-me"></select>

Then, I'm able to make it look like a selectable element:

 $("#satan-hates-me").select2({
    placeholder: "Hail",
    minimumInputLength: 1,
    ajax: { // Here that bad things happen, I mean, don't happen
      url: "http://localhost/os/backend/TestServiceOrder.php?req=getEquipments",
      dataType: "json",
      type: "GET",
      quietMillis: 50,
      data: function(term) { return { term: term } },
      results: function(data) { return data; }
    }
  });

I'm performing this wrapped in a load function, after page loading, it looks like a selectable, but sends no requests, and the script returns me exactly the required format, as example:

[{id: 1, text: "Sadness"}, {id: 2, text: "Depression"}]

And here goes. I can design compilers but I can't in the world make a plugin work with Ajax! Can somebody help me, please?

Counterbalance

Ah, what a perfect day to die! – Counterbalance

results is now processResults in 4.0.0. And have you confirmed that no requests are sent within your developer tools, or is this based on logging within results? – Clariceclarie

Oh, yeah, I did. In the end, I solved it by an external request and by using async programming with monads to deal with computations that may fail. – Counterbalance

That the lords of monads and async programming forgive me by doing workarounds with monads. – Counterbalance

still no solution!!?? been trying to resolve it since last 4 hours, no luck – Kory

Answer 1

Finally resolved the issue.

<input> is not supported in select2 v4

.You have to use <select> element instead

Kory

Thank you. This resolved a similar issue for me (using simple_form, specified as: :select fixed it) – Highbred

Answer 2

In my case, it was a general select2-call of .select2-Elements in the footer of all my templates:

$('.select2').select2();

Event though my select for the Ajax-Request didn't have that class at all (I called it via an id), I had to change the above to

$('select.select2').select2({theme: 'classic'});

I guess select2() creates several elements with the class .select2, so that might interfere

Banger

This answer should be upvoted since there is no easy way to know that select2 class must be avoided – Cordiecordier