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.

Can you attach `privChanged()` function definition to the question. — Stewie, Mar 26 '13 at 15:10
yes, I attached it. the problem was sth else. I post in answer — biesczadka, Mar 29 '13 at 12:03

score 20 · Accepted Answer · edited Jun 17 '16 at 06:44

20

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

edited Jun 17 '16 at 06:44

Piotrek Hryciuk

785
10
23

answered Mar 29 '13 at 12:05

biesczadka

571
1
7
19

2

Can you give me a full example. I've this problem too. – iroel Dec 04 '13 at 07:04
Just add this function to $scope.privNameSelect2options and instead of 'code' put a name of a field which is identifier in your entity. – biesczadka Dec 09 '13 at 14:00

score 7 · Answer 2 · edited May 23 '17 at 10:29

7

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}

edited May 23 '17 at 10:29

Community

1
1

answered Mar 19 '14 at 14:03

Till

1,097
13
13

score 1 · Answer 3 · answered Feb 26 '14 at 23:10

1

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

answered Feb 26 '14 at 23:10

Ed Halferty

136
2
10

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

3 Answers3

Linked