jquery-ui自动完成问题

Question

I'm using the jQuery auto-complete, but I notice a strange issue that is happening in my input. For example, in the example below:

    $(function() {

var data = var data = [
  {
    "label": "12 12 North",
    "value": "12 North",
    "country_code": "IN",
    "name": "12 North",
    "code_airline": 12
  },
  ...];

          $('#sample-01').autocomplete({
            maxShowItems: 5,
              minLength:2,
            source: data
          });

        });

I'm getting an array of objects that gives me some information regarding, in my case, airline companies. If I start to search for the first characters of the airline company it gives me the correct label.

But then when I try to replace the data variable with the URL source, to be like:

$('#sample-01').autocomplete({
            maxShowItems: 5,
              minLength:2,
            source: "http://www.json-generator.com/api/json/get/cqycMlSXci?indent=2"
          });

It is not giving me the correct label/company name, as if the autocomplete stops filtering the correct data. What is wrong with my code?

Answer 1

From jqueryui :

String : When a string is used (...) The Autocomplete plugin does not filter the results....

Try loading json data first, then populate autocomplete plugin. For example:

$(function(){
    var json = $.getJSON("http://www.json-generator.com/api/json/get/cqycMlSXci?indent=2");
    json.done(function(data){
        $('#sample-01').autocomplete({
            maxShowItems: 5,
            minLength:2,
            source: data
        });
    });
});