How to handle autocomplete in Angular.JS from JSON feed

Question

I am working on implementing autocomplete for a text box similar to what is done here. The main difference being I want mine to come from a service returning a list. Here is the code I use...

  //How I would like it to work...
  $scope.search=function(query){
    $http.get('/product/query/name%3A'+query+'*').success(function(data){
      // For a data is ["a","a1"]
      $scope.names = data;
    })
  }
  //Trying to get it to work by not using the ng-change event but still no dice
  $http.get('/product/query/name%3A*').success(function(data){
      //Data when printed does in fact match the ["a","a1", "b"]
      $scope.names = data;
  });
  //finally this DOES work but not dynamic
  $scope.names =["a","a1", "b"];

Anyone able to provide some insight as to what I am missing?

try to create a factory and do the http call from factory and then assign the results to scope.name — V31
– V31, Commented Jul 6, 2014 at 19:35

Jossef Harush Kadouri · Accepted Answer · 2014-07-06 19:36:09Z

2

you can use typeahead which is part of angular-ui library

http://plnkr.co/edit/08vi4ncjLrWfUBjWrZKS?p=preview

enter image description here

answered Jul 6, 2014 at 19:36

Jossef Harush Kadouri

34.6k10 gold badges143 silver badges133 bronze badges

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

5 Comments

charlietfl Over a year ago

just an FYI, plunker link is no good now, they use a post to send code to plunker when you click "edit in plunker"

Jackie Over a year ago

I will take a look thanks, any idea why this situation is failing?

Jackie Over a year ago

So I tried this out and I am about ready to give the check. The last thing I am struggling with is how would I use an attribute. For example if I need a name and an ID to map back to the object? This example just pushes a single value. So in this sample I need the formatted address along with the address id

Jackie Over a year ago

Would something like typeahead="address.name for address in getLocation($viewValue)" work?

Jossef Harush Kadouri Over a year ago

@Jackie, here's a new plunk with your desires :) plnkr.co/edit/5OeZ7e7Q6jYP2LkKN1jm?p=preview

Collectives™ on Stack Overflow

How to handle autocomplete in Angular.JS from JSON feed

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related