Select2-rails 4.0.3 cannot trigger ajax

I can success to get an array result by having following code in script

   $.ajax({
      url: "/search",
      dataType: 'json',
      type: "GET",
      data: {
        query: "test",
      },
      success:function(result){
        console.log(result);
      }
    });

but when I try to use ajax in select2-rails

$(".select2").select2({
  ajax: {
    url: "/search",
    dataType: 'json',
    type: "GET",
    delay: 250,
    data: { query: "test" },
    processResults: function (data) {
      console.log(data);
      return {
        results: data.results,
      };
    },
    cache: true
  },
  theme: "bootstrap",
  escapeMarkup: function (markup) { return markup; }, 
  multiple: true,
  templateResult: TemplateResult,
  templateSelection: TemplateSelection,
  placeholder: "Type to search",
});

It seems like it cannot make ajax GET request inside select2 because console is always nothing.

The select2 should not have problem at assets included part since it works like charm when I used pre-defined data

var data = [{ id: 0, name: 0 }, { id: 1, name: 1 }];

$(".select2").select2({
  data: data,
  theme: "bootstrap",
  escapeMarkup: function (markup) { return markup; }, 
  multiple: true,
  templateResult: TemplateResult,
  templateSelection: TemplateSelection,
});

Inside the script, it should trigger the select event when document is ready

$(document).ready(function () { ... }

and declare the monitoring element using select element like following

<select class="select2" multiple="multiple" name="search[item_ids][]"
 id="search_item_ids" />

but not using hidden field

<%= f.hidden_field :item_ids, multiple: "multiple", class: "select2" %>