Can't select item in list created by ui-select2

Question

In my HTML I have this line:

<input  ng-change="privChanged()" ng-model="selectedPriv" ui-select2="privsSelect2options"></input>

and the privsSelect2options function:

$scope.privsSelect2options = {
    placeholder: "Wybierz privo",
    allowClear:true,
    minimumInputLength: function(){return  3;},
    formatInputTooShort: function (input, min) {return "Wprowadź conajmniej " + min + " znaki.";},
    formatSearching: function () { return "Wyszukiwanie..."; },
    formatNoMatches: function () { return "Nie znaleziono pasujących województw."; },
    query: function (query) {
       query.callback( {results: $filter('filter')($scope.privs,{name: query.term}) } );
    },
    formatResult: function(priv){
        return priv.name;
    },
    formatSelection: function(priv){
        return priv.name;
    }
}; 

Everything works OK when I put 3 letters it filters the result and shows it correct but I can't click and select any item from the result list. Can anyone help me in this matter? It doesn't even come into the formatSelection function.

Answer 1

the problem was that Priv class/table didn't have id property, and its Primary Key was field code. I had to add function :

id : function(priv) {
        return priv.code;
     },

in $scope.privNameSelect2options

Answer 2

Please refer to Select2 Ajax Method Not Selecting,

and take the correct value:

id: function(data){return {id: data.id};},

or

id: function(data){return data.id}

Answer 3

Although this isn't really specified in the select2 documentation, you'll need to pass an id key with a function value to select2.

$scope.privsSelect2options = {
    id: function(element) { return element.name; }
    ...
};