How to get datalist selected options id's value with ng-repeat and fillter?

Question

I used datalist to search the value which I entered in input field and filtered. I need to send selected options id to the controller function.

<input list="browsers" type="text" id="searchtextbox" class="form-control" placeholder="Search" ng-model="searchText">
<datalist id="browsers">
       <option ng-repeat="data in enroldata | filter: searchText" id="{{data.USERID}}" id="{{data.USERID}}" value="{{data.FIRSTNAME}} {{data.LASTNAME}}">{{data.FIRSTNAME}} {{data.LASTNAME}}</option>
 </datalist>
  <input type="button" class="btn btn-primary btn-flat" ng-click="enrol({{data.USERID}})" value="Send" />

In controller

 $scope.enrol = function (USERID) {
        debugger;
        var value = $scope.USERID;
        var val = $('#searchtextbox').val();
        var states = $('#browsers');
        var endVal = $(states).find('option[value="' + val + '"]');
        //depending on your logic, if endVal is empty it means the value wasn't found in the datalist, you can take some action here
        return endVal.text();

      
        var USERID1 = $scope.searchText;
        //var value = $('#searchText').val();
        //alert($('#browsers [value="' + value + '"]').data('value'));
        //var x = $('#searchtextbox').val();
        //var z = $('#browsers');
        //var val = $(z).find('option[value="' + x + '"]');
        //var endval = val.attr('id');
        //alert(endval);
        debugger;
        var dat = {
            "courseid": localStorage.getItem("courseid")
        , "USERID": USERID
        }
}

I need search by username and pass the USERID by fucntion or with id binding.... I tried to call it by id and passed with function its return undefined.

This is not the _angular way_ of doing things. I suggest you read up on [this answer](http://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-i-have-a-jquery-background) first. — dcodesmith, Jun 06 '16 at 12:26
Seems like using wrong UI control. What if user doesn't select from data list? As mentioned you should never have any jQuery like this in an angular controller — charlietfl, Jun 06 '16 at 12:31
sorry, i am new to angularjs.... any way to pass userid when searched username selected.... i tried ng-change also — Desa Kumaaran, Jun 06 '16 at 12:35

score 0 · Accepted Answer · answered Jun 06 '16 at 12:49

0

ng-repeat="data in enroldata | filter: searchText" data is only accessible from the inside of ng-repeat I think You can simply call enrol() on click (ng-click="enrol()") and get data inside the controller from the $scope.enrolData

answered Jun 06 '16 at 12:49

E. Abrakov

463
2
6

'' i tried inside the option tag but it didnt work...i tried ng-change also......if i try this inside the input it will work but i cant pass USERID.. – Desa Kumaaran Jun 06 '16 at 13:03
Leave your options as is. Create a button with `ng-click="enrol()"` outside of the datalist. Then You can access to data from the controller. f.e. if selected item has property `selected = true` so You can filter items in $scope.enrolData with only item.selected === true – E. Abrakov Jun 06 '16 at 13:14
i think this will work....Thank you... and used table like this and worked well.....'
{{c.FIRSTNAME}} {{c.LASTNAME}}

' – Desa Kumaaran Jun 07 '16 at 07:25

How to get datalist selected options id's value with ng-repeat and fillter?

1 Answers1