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

Which plugin are you using? Or is this jQuery UI Autocomplete? — user7675
– user7675, Commented Nov 15, 2010 at 13:30
If that is the actual response then it won't work anyway because it is missing the final bracket and thus isn't a valid array. — Coin_op
– Coin_op, Commented Nov 15, 2010 at 13:32
Also can you show us a little bit more of the code you are using with this so we can see the full picture? — Nathan Hess
– Nathan Hess, Commented Nov 15, 2010 at 13:32

Darin Dimitrov · Accepted Answer · 2010-11-15 13:57:04Z

6

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;
            }));
        });
    }
});

edited Nov 15, 2010 at 13:57

answered Nov 15, 2010 at 13:32

Darin Dimitrov

1.0m276 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Castro Over a year ago

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

Castro Over a year ago

Do you recommend me to use another one?

Darin Dimitrov Over a year ago

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

Castro Over a year ago

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

Collectives™ on Stack Overflow

JSON for Jquery autocomplete

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related