JSON for Jquery autocomplete

Question

I've JSON response from php file.

[{
  "NAME": "Kiev"
}, {
  "NAME": "Kiev metro"
}, {
  "NAME": "Kiev-Dnepro"
}, {
  "NAME": "Kiev-Dnepro"
}, {
  "NAME": "Kiev-Donetsk"
}, {
  "NAME": "Kiev-Donetsk"
}]

How can I use that for standard Jquery autocomplete? Autocomplete function do request but it seems it cant parse response for this json (simple array works fine). Help me please

---

Derin, yes that's it. Works fine! But now I want to modify it a little. I getting more data in response and I'd like to display it near of main autocomplete input

var infoGISName = null;
var infoGISType = null;
var infoGISLocationID = null;
var infoGISParentID = null;

$('#GISName').autocomplete({
source: function(request, response) {
  $.getJSON("autocomplete.php", {
    term: request.term
  }, function(result) {
    response($.map(result, function(item) {
      infoGISName = item.NAME;
      infoGISType = item.GIS_TYPE;
      infoGISLocationID = item.LOCATION_ID;
      infoGISParentID = item.PARENT_ID;
      return item.NAME;
    }));
  });
},
change: function(event, ui) {
  $('#infoGISName').html(infoGISName);
  $('#infoGISType').html(infoGISType);
  $('#infoGISLocationID').html(infoGISLocationID);
  $('#infoGISParentID').html(infoGISParentID);
},
minLength: 3

});
});

So how to change data in fields when I changed text in autocomplete input? Now I see just last values from JSON recordset

Solution

You could use the formatItem option:

$('#foo').autocomplete({ 
    url : '/foo', 
    formatItem: function(item, position, length) {
        return item.NAME;
    } 
});

---

For the jquery ui autocomplete here's how you could achieve this:

$('#foo').autocomplete({
    source: function(request, response) {
        $.getJSON('/foo.php', { q: request.term }, function(result) {
            response($.map(result, function(item) {
                return item.NAME;
            }));
        });
    }
});

Comments

[Castro]

I try to use jqueryui.com/demos/autocomplete because I download full JUI pack

[Castro]

Do you recommend me to use another one?

[Darin Dimitrov]

@Castro, please see my update for an example with jqueryui autocomplete.

[Castro]

Derin, yes that's it. Works fine! But now I want to modify it a little. I getting more data in response and I'd like to display it near of mail autocomplete input