ui-select2 with ajax?

[chicoxyzzy]

I am trying to get it work all day. Does this functionality works in angular? Can someone provide an example if so?

[havelaer]

Use an input tag instead of a select tag and pass in some select2 options:

<input type="hidden" ui-select2="{query: query, minimumInputLength: 3}" ng-model="select2" data-placeholder="Select a song" />

example for the query function in your controller:

$scope.query = function (query) {
  $http.get('http://ws.spotify.com/search/1/track.json', {
    params: {
      q: query.term
    }
  }).then(function(res){
    var songs = { results: [] };
    angular.forEach(res.data.tracks, function (song) {
      songs.results.push({
        text: song.artists[0].name + ' - ' + song.name,
        id: song.href
      });
    });
    query.callback(songs);
  });
};

[coryfoo]

I am also not able to get the ajax functionality to work, at least with multiple=true set.

The problems I see are:

• If a custom "formatSelection" function is not defined, the label of the selected item is "undefined"
• If a custom "formatSelection" function is defined, then the function is actually triggered three times. The first time the function is called, the first parameter is the selected object (ie, { id:0, text:"foo"} ). The two subsequent calls are with the "id" property the selected value. So, picking the label is, somewhat tricky.
• When selecting a second item (because it is a multiple input), it will clear previous entry so there is only one in the box now. The input is cleared during the same event thread that calls the "formatSelection" function the second time.

[asppsa]

It seems to work if you revert to v0.0.4

[kbanman]

I believe this is related to #136 and #143